Skip to content

Commit

Permalink
srcset resolutions now treated as minimum resolutions.
Browse files Browse the repository at this point in the history
  • Loading branch information
Wilto committed Jun 16, 2012
1 parent 782fcfd commit 97d19ed
Showing 1 changed file with 5 additions and 5 deletions.
10 changes: 5 additions & 5 deletions picturefill.js
Original file line number Original file line Diff line number Diff line change
Expand Up @@ -60,24 +60,24 @@
} }


if( srcset ) { if( srcset ) {
var screenRes = w.devicePixelRatio || 1, // Is it worth looping through reasonable matchMedia values here? var screenRes = w.devicePixelRatio || 1, // Is it worth looping through reasonable matchMedia values here?
sources = srcset.split(","); // Split comma-separated `srcset` sources into an array. sources = srcset.split(","); // Split comma-separated `srcset` sources into an array.


for( var res = sources.length, r = res - 1; r >= 0; r-- ) { // Loop through each source/resolution in `srcset`. for( var res = sources.length, r = res - 1; r >= 0; r-- ) { // Loop through each source/resolution in `srcset`.
var source = sources[ r ].replace(/^\s*/, '').replace(/\s*$/, '').split(" "), // Remove any leading whitespace, then split on spaces. var source = sources[ r ].replace(/^\s*/, '').replace(/\s*$/, '').split(" "), // Remove any leading whitespace, then split on spaces.
resMatch = parseInt( source[1], 10 ); // Parse out the resolution for each source in `srcset`. resMatch = parseFloat( source[1], 10 ); // Parse out the resolution for each source in `srcset`.


if( resMatch == screenRes && picImg.getAttribute( "src" ) !== source[0] ) { if( screenRes >= resMatch && picImg.getAttribute( "src" ) !== source[0] ) {
var newImg = document.createElement("img"); var newImg = document.createElement("img");


newImg.src = source[0]; newImg.src = source[0];

// When the image is loaded, set a width equal to that of the original’s intrinsic width divided by the screen resolution: // When the image is loaded, set a width equal to that of the original’s intrinsic width divided by the screen resolution:
newImg.onload = function() { newImg.onload = function() {
this.width = ( this.cloneNode( true ).width / screenRes ); // Clone the original image into memory so the width is unaffected by page styles this.width = ( this.cloneNode( true ).width / resMatch ); // Clone the original image into memory so the width is unaffected by page styles
} }
picImg.parentNode.replaceChild( newImg, picImg ); picImg.parentNode.replaceChild( newImg, picImg );
} }
break;
} }
} else { } else {
// No `srcset` in play, so just use the `src` value: // No `srcset` in play, so just use the `src` value:
Expand Down

0 comments on commit 97d19ed

Please sign in to comment.