LazyLoad插件

我正在使用jQuery Lazy Load在页面上加载缩略图我有一个每页大约100多个缩略图的列表。 这个插件工作得很完美，直到我引入插件Quick Pagination一次显示九个缩略图并为用户提供下一个和上一个。

当单击“下一个”或“上一个”时，您将获得灰色占位符图像，因为页面滚动不再是一个因素。

我尝试了不同的事件，甚至创建了自己的事件，这只会加载所有缩略图，甚至是（下一个和上一个）阈值以下的缩略图。

有没有触发滚动事件？ 喜欢这个人做过> http://blog.3circlestudio.com/development/how-to-use-lazy-load-with-easy-slider-1-7/

我也尝试过这个，没有运气。

$('.thumbs').lazyload({ placeholder:'/thumbnail.gif' }); 

没有Quick Pagination和滚动关于作品！

 $('#thumbnails').paginate({ pager: $('div#pagination') }); 

介绍paginate工作以生成每个9个缩略图的列表，打破lazyload。 我猜我想问的是，每次点击Next链接时如何调用缩略图。

Answer 1

我只想出来，它正在工作！ 当调用Next和Previous时，我在Quick Pagination中创建了一个函数。 在这个函数中，我插入了以下内容。

 var scrollTop = function() { $('html, body').animate({scrollTop:0}, 'slow', function() { $(window).trigger('scroll'); }); } 

通过将动画放置在滚动顶部我修复了问题以滚动页面，并通过放置$（window）.trigger（’scroll’）; 在动画中，它会触发滚动并加载下一组照片。 希望这对任何人都有意义 – 为了我的目的，它正在发挥作用。

是!

Answer 2

我认为这两个插件是截然相反的。 我建议使用lazyload和scrollto插件。 这应该可以满足您的需求，只需确保按如下方式调用lazyload即可

 $('thumbs').lazyload({ placeholder:'/thumbnail.gif', container:$('#thumbnails') }); 

Answer 3

jquery LazyLoad插件在FF3.6上对我不起作用。 如果我用Firebug检查演示页面，我可以看到所有图像都加载了onload。

你可以查看一个名为JAIL的插件，它可以很好地工作（很少有例子）。 我建议在打开示例页面时保持Firebug的Net选项卡打开。

Answer 4

在这里找到： https ： //stackoverflow.com/a/17171241/891052使用它来触发lazyload

 $(window).resize();