Permalink
Browse files

Fixes incorrect `srcset` reevaluation on resize.

  • Loading branch information...
1 parent d8f45e2 commit d275823375c4c4de45944ae2f29438fcff6bb61e @Wilto committed Jun 18, 2012
Showing with 17 additions and 14 deletions.
  1. +17 −14 picturefill.js
View
@@ -60,25 +60,28 @@
}
if( srcset ) {
- 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.
+ 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.
- 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.
- resMatch = parseFloat( source[1], 10 ); // Parse out the resolution for each source 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.
+ resMatch = parseFloat( source[1], 10 ); // Parse out the resolution for each source in `srcset`.
- if( screenRes >= resMatch && picImg.getAttribute( "src" ) !== source[0] ) {
- var newImg = document.createElement("img");
+ if( screenRes >= resMatch ) {
+ if( picImg.getAttribute( "src" ) !== source[0] ) {
+ var newImg = document.createElement("img");
- 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:
- newImg.onload = function() {
- this.width = ( this.cloneNode( true ).width / resMatch ); // Clone the original image into memory so the width is unaffected by page styles
+ 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:
+ newImg.onload = function() {
+ // Clone the original image into memory so the width is unaffected by page styles:
+ this.width = ( this.cloneNode( true ).width / resMatch );
+ }
+ picImg.parentNode.replaceChild( newImg, picImg );
+ }
+ break; // We’ve matched, so bail out of the loop here.
}
- picImg.parentNode.replaceChild( newImg, picImg );
- break;
}
- }
} else {
// No `srcset` in play, so just use the `src` value:
picImg.src = match.getAttribute( "src" );

0 comments on commit d275823

Please sign in to comment.