use srcset in each and every browser today. display responsive and hi-res images.
bower install jquery.srcset
Three quick start options are available:
- download the latest release.
- clone the repo:
git clone https://github.com/andrezimpel/jquery-srcset.git. - install with bower:
bower install jquery.srcset.
jquery-srcset behaves like srcset should. it extends the functionality (width and density combined) of Safari on Mac and iOS. last but not least it add's support to older browsers, like that one a company recently killed. if you want to know more about srcset hit this link and read a nice article by smashing magazine.
just include the following scripts:
<script src="http://code.jquery.com/jquery-1.9.0.js"></script>
<script src="/path/to/bower_components/jquery-srcset/jquery.srcset.js"></script>
<script src="... others"></script>the image tag should look like this:
<img src="/path/to/image.jpg"
srcset="/path/to/image-mobile.jpg 320w 1x,
/path/to/[email protected] 320w 2x">then run:
$('[srcset]').srcset();that's it.
the following options are available
$('[srcset]').srcset({
// check if the image is available
ajax: true // default: true
});andre zimpel
hit me up if you want to join!
code and documentation copyright 2011-2014 andre zimpel. code released under the MIT license.