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

Question

我正在与 延迟加载 仅当图像可见时才加载图像，并且不会加载从弹出菜单中首先可见的图像。所有图像均位于 <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 属性，然后触发这些事件，没有运气。

Answer 1

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

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