search

JimBobSquarePants / srcset-polyfill

An image srcset polyfill that provides fallback behaviour for browsers that do not support the srcset attribute.
http://jimbobsquarepants.github.io/srcset-polyfill/
18 stars 8 forks source link

Chrome 36 supports srcset attribute but not its functionality #7

Open AnJ95 opened 10 years ago

AnJ95 commented 10 years ago

I am encountering a problem regarding your polyfill which is and will be extremely useful for fallbacks even in coming years. Now the problem is, that Google Chrome 36.0.1985.125 seems to have added the srcset attribute to images even though it is not used. Therefore,

"srcset" in document.createElement("img")

returns true in Chrome.. Might there be a way to specify that condition?

appsforartists commented 10 years ago

srcset is now supported in Chrome, but according to caniuse, Safari's implementation is incomplete.

The test should be rewritten to do proper feature detection. For instance,

var img = document.createElement("img");
img.setAttribute("srcset", "data:… 10w, data:… 20w, data:… 30w");
img.setAttribute("sizes", "10px");
// run through your polyfill and see if the browser displayed the same image
// if does, try again with "2x" and "3x" instead of "20w, …30w"
// if both tests pass, don't install the polyfill
appsforartists commented 10 years ago

FWIW, I came to this repo after a quick Google search for a srcset polyfill, but this looks more robust:

http://scottjehl.github.io/picturefill/

I'll likely go that way for my iOS 8 supporting-needs.

JimBobSquarePants commented 10 years ago

Thanks.

I'm actually gonna put up a notice saying do not use for this repo as unfortunately I don't have the time to maintain it. Feel free to fork it though.

Of all the implementations I have seen this is the one that has caught my eye. Better than Piturefill in my opinion. https://github.com/aFarkas/respimage