welsonjs/node_modules/modernizr/feature-detects/img/sizes.js

47 lines
1.3 KiB
JavaScript

/*!
{
"name": "sizes attribute",
"async": true,
"property": "sizes",
"tags": ["image"],
"authors": ["Mat Marquis"],
"notes": [{
"name": "WHATWG Spec",
"href": "https://html.spec.whatwg.org/multipage/embedded-content.html#the-img-element"
}, {
"name": "Srcset and sizes",
"href": "https://ericportis.com/posts/2014/srcset-sizes/"
}]
}
!*/
/* DOC
Test for the `sizes` attribute on images
*/
define(['Modernizr', 'createElement', 'addTest'], function(Modernizr, createElement, addTest) {
Modernizr.addAsyncTest(function() {
var width1, width2, test;
var image = createElement('img');
// in a perfect world this would be the test...
var isSizes = 'sizes' in image;
// ... but we need to deal with Safari 9...
if (!isSizes && ('srcset' in image)) {
width2 = 'data:image/gif;base64,R0lGODlhAgABAPAAAP///wAAACH5BAAAAAAALAAAAAACAAEAAAICBAoAOw==';
width1 = 'data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==';
test = function() {
addTest('sizes', image.width === 2);
};
image.onload = test;
image.onerror = test;
image.setAttribute('sizes', '9px');
image.srcset = width1 + ' 1w,' + width2 + ' 8w';
image.src = width1;
} else {
addTest('sizes', isSizes);
}
});
});