Question

我为我的网站运行了LazyLoad脚本，并且遇到了一个小问题。

我在水平滚动（从左到右）上使用Lazy Load，图像相当宽。该脚本完美运行并在200px内淡入（或默认值为）。

但是我注意到如果窗口打开到较小的尺寸，然后打开到完整窗口，占位符Lazy Load只有在较小的窗口大小期间加载的图像是“In View”。它会在滚动条移动后加载，但我很好奇是否有任何脚本我可以沿着这些行添加'当窗口调整大小时，重新测量查看空间'

希望这是有道理的。我对JavaScript知之甚少，所以如果有人知道如何解决这个问题，请随意回复，好像你正在和一个5岁的孩子一步一步地说话一样：）

Answer 1

找到这行代码（在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);});

并在此之后添加：

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

Answer 2

将failure_limit设置为10会导致插件在找到折叠后的10张图像后停止搜索要加载的图像。如果您有一个时髦的布局，请将此数字设置为高，以解决您的问题，例如：

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

Jquery LazyLoad.js在窗口调整大小后加载问题

2 个答案: