Jquery LazyLoad.js Issue with Loading after Window Resize

Question

Im running the LazyLoad script for my website and having an issue with one small aspect of it.

Im using Lazy Load on a Horizontal scroll (left to right) with fairly wide images. The script works perfectly and fades in within 200px (or whatever the default is).

However I noticed if the window is opened to a smaller size, then opened to full window, the placeholder, Lazy Load has only the image loaded that was "In View" during the smaller window size. It loads once the scroll bar is moved, but Im curious if there's any scripting I could add along the lines 'When the window resizes, re-gauge the viewing space'

Hopefully this makes sense. I know very little about JavaScript so if anyone knows how to solve this feel free to respond as if you were talking to a 5 year old with step by step instructions :)

user498529 · Accepted Answer · 2011-06-16 13:48:50Z

1

Find this line of code (inside lazyload.js):

$(settings.container).bind("scroll",function(event){var counter=0;elements.each(function(){if($.abovethetop(this,settings)||$.leftofbegin(this,settings)){}else if(!$.belowthefold(this,settings)&&!$.rightoffold(this,settings)){$(this).trigger("appear");}else{if(counter++>settings.failurelimit){return false;}}});var temp=$.grep(elements,function(element){return!element.loaded;});elements=$(temp);});

and add after that this:

$(window).bind("resize",function(event){$(settings.container).trigger('scroll');});

answered Jun 16, 2011 at 13:48

user498529

1468 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Noz · Accepted Answer · 2013-02-20 17:51:50Z

0

Setting failure_limit to 10 causes plugin to stop searching for images to load after finding 10 images below the fold. If you have a funky layout set this number to something high to solve your problem, an example:

$('img').lazyload({effect:'fadeIn', failure_limit:40});

edited Feb 20, 2013 at 17:51

Noz

6,3573 gold badges50 silver badges82 bronze badges

answered Feb 20, 2013 at 17:25

closure

1233 silver badges6 bronze badges

Collectives™ on Stack Overflow

Jquery LazyLoad.js Issue with Loading after Window Resize

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related