Minimal picture size with picturefill.js

Example on how to use picturefill.js for serving out images depending on viewport.

<!doctype html>
      // Picture element HTML5 shiv
      document.createElement( "picture" );
    <script src="picturefill.js" async></script>
            <!--[if IE 9]><video style="display: none;"><![endif]-->
            <source srcset="camp-site-lrg.jpeg" media="(min-width: 992px)">
            <source srcset="camp-site.jpeg" media="(min-width: 641px)">
            <source srcset="camp-site-small.png" media="(min-width: 0px)">
            <!--[if IE 9]></video><![endif]-->
            <img srcset="camp-site-lrg.jpeg" alt="alt text goes here" class="img-responsive">
                  <img class="img-responsive" src="camp-site-lrg.jpeg" alt="alt text goes here" />

Add your comment