briangonzalez / jquery.adaptive-backgrounds.js

🦎 A jQuery plugin for extracting the dominant color from images and applying the color to their parent.
http://briangonzalez.github.io/jquery.adaptive-backgrounds.js/
6.53k stars 454 forks source link

Mobile Safari #21

Closed davidtzvi closed 9 years ago

davidtzvi commented 10 years ago

There seems to be a problem with CORS on Mobile Safari.

The plugin is managing to execute perfectly on regular browsers but when testing on the iPad and iPhone (latest OS) the plugin fails most of the time. The images either don't load at all, other times the image loads fine but the background colors are not extracted/applied, and other instances work as expected.

I can see CORS related errors in the console for Mobile Safari. Also, when I serve those same images from the same domain (instead of my cdn subdomain) these errors don't occur and the plugin works fine.

My host has also implemented the CORS rules mentioned in the plugin's caveats.

Impressive plugin. Just wish I could get it to work on iOS and my CDN.

davidtzvi commented 10 years ago

Could it be that the crossOrigin attribute is simply not accepted by (mobile) Safari and the workaround would be retrieving image data with XHR?

I bumped into this: https://twitter.com/sonnypiers/status/187513545397776384

This page ("Browser compatibility" section) seems to imply that Safari doesn't support CORS attribute yet: https://developer.mozilla.org/en-US/docs/Web/HTML/CORS_enabled_image

briangonzalez commented 10 years ago

Weird, it works sometimes in mobile safari. Let's keep this issue open and monitor the links above.

Thanks!