触发延迟加载 jQuery 插件的滚动事件答案

【问题标题】：Triggering scroll event for Lazy Load jQuery plugin触发延迟加载 jQuery 插件的滚动事件
【发布时间】：2014-07-30 14:35:14
【问题描述】：

我正在与Lazy Load 合作，仅在图像可见且未加载从弹出菜单中首次可见的图像时才加载图像。所有图像都位于无序列表上的<li> 元素内。当我开始向下滚动列表时，图像开始按应有的方式加载。但是，如何在第一次打开菜单时显示几张第一张图片？

我曾尝试触发scroll 事件以及其他事件，但它们似乎都不起作用。 <ul> 位于从“信息栏”（只是页面顶部带有链接的栏）弹出的菜单中。我在想这可能与它们（图像）在页面加载时不容易看到的事实有关？

这是我的延迟加载初始化：

$("img.lazy", this.list).show().lazyload({
  effect: "fadeIn",
  container: this.list,
  threshold: 50
});

$(this.list).trigger("scroll"); // tried this
$(document).trigger("scroll"); // and that

// this.list is the unordered list

我还尝试使用mouseenter 和scrollstop 作为event 属性来初始化插件，然后触发这些事件，没有运气。

【问题讨论】：

标签： html jquery jquery-events jquery-lazyload

【解决方案1】：

第二个this.list 是你出错的地方。延迟加载适用于 <img> 元素，而不适用于 <ul>

$("img.lazy", this.list).trigger("scroll"); // should work

【讨论】：

它似乎没有任何区别。也许是因为当我触发滚动事件时实际的ul 还不可见？打开菜单时，在实际显示之前需要加载几项内容。打算及时在几个不同的地方尝试一下
是的，这是您的建议和我的怀疑的结合。如果我在列表实际可见后调用trigger，它会按预期加载图像。谢谢！