polyfill for css4 image-set
JavaScript
Switch branches/tags
Nothing to show
Latest commit e8d16b9 Jul 26, 2016 @wtfil wtfil bump version
Permalink
Failed to load latest commit information.
examples mutation observer Jun 18, 2015
.jshintrc jshint Mar 25, 2014
README.md added bower in readme Jun 19, 2015
bower.json bump version Jul 26, 2016
image-set-polyfill.js Simplify regexp in getPolyfilledStyles Jul 25, 2016
image-set-polyfill.min.js fixed firefox Jun 18, 2015
package.json bump version Jul 26, 2016

README.md

image-set polyfill

polyfill for css4 function image-set() (http://dev.w3.org/csswg/css-images/#image-set-notation)

install

you can install image-set-polyfill with bower or with npm

bower install --save image-set-polyfill

npm install --save image-set-polyfill

usage

You should only inlude image-set-polyfill.js on your page

<script type="text/javascript" src="image-set-polyfill.min.js"></script>

supports

css styles

.smart-image 
{
    background-image:  -webkit-image-set(
        url('http://upload.wikimedia.org/wikipedia/commons/thumb/9/93/Cat_poster_2.jpg/297px-Cat_poster_2.jpg') 1.0x,
        url('http://upload.wikimedia.org/wikipedia/commons/thumb/9/93/Cat_poster_2.jpg/594px-Cat_poster_2.jpg') 2.0x
    );
}

inline styles

<div style="background-image: -webkit-image-set(url(lowdpi.png) 1.0x, url(highydpi.png) 2.0x )"></div>