anthony-dandrea/Picturefill.md

Created May 26, 2015 20:37

Star (0) You must be signed in to star a gist
Fork (0) You must be signed in to fork a gist

Learn more about clone URLs
Clone this repository at <script src="https://gist.github.com/anthony-dandrea/fb7f458151511c6afcd5.js"></script>
Save anthony-dandrea/fb7f458151511c6afcd5 to your computer and use it in GitHub Desktop.

Picturefill

Raw

I pretty much just followed the directions here - http://scottjehl.github.io/picturefill/ In my markup I have something like:

  <html>
    <head>
      <script src="scripts/vendor/picturefill.min.js"></script>
    </head>
    <body>
      <picture>
				<!--[if IE 9]><video style="display: none;"><![endif]-->
				<source srcset="images/desktop-size.png" media="(min-width: 640px)">
				<!--[if IE 9]></video><![endif]-->
				<img class="app-layer-img" srcset="images/mobile-size.png">
			</picture>
    </body>
  </html>

Note: IE9 is dumb which is why those silly IE conditionals are there =-[

DLavin23 commented May 26, 2015

  <picture>
    <source srcset="http://placehold.it/1200x600" media="(min-width: 1000px)">
    <source srcset="http://placehold.it/800x600" media="(min-width: 800px)">
    <img srcset="/path-to-my-image" alt="Loyalty">    
  </picture>

DLavin23 commented May 26, 2015

for whatever reason I can't get my local images to load