在延迟加载多个容器(Multiple containers in Lazy Load)

我想申请延迟加载插件到多个容器。 我发现这个类似的问题： 延迟加载在多个水平容器 。

这是我的尝试： http://jsfiddle.net/BAFMC/

$(".p_outer_content").each(function() {
    var tthis = $(this);
    $(this).find('img').lazyload({
        container: tthis
    });
});​

但我有同样的问题中提到的问题，这是一个懒惰的负载只适用于最后一个容器（.p_outer_content）（这是在骗取钱财的第三个）。

有谁知道如何解决这个问题或有其他的建议？ 提前致谢'

编辑：

好吧，我试过每次容器中的一个滚动重新应用lazyload功能：

$(".p_outer_content").each(function() {
    var tthis = $(this);
    $(this).find('img').lazyload({
        container: tthis
    });
});

$(".p_outer_content").scroll(function() {
    var tthis = $(this);
    $(this).find('img').lazyload({
        container: tthis
    });

});​

http://jsfiddle.net/BAFMC/4/

其工作原理，但我不知道这是否是解决它的一个好办法。 但是有谁拿出一个更好的解决办法？ 谢谢'

Answer 1:

有一个在LazyLoad插件的错误。 当您提供自定义的容器，有一个全局变量泄漏。 我已经在这个叉这里添加的最小必要的修复。

https://raw.github.com/marchingants/jquery_lazyload/master/jquery.lazyload.js

这里的工作演示http://jsfiddle.net/BAFMC/5/

我直接用GitHub的原始文件在这个例子中，但在你的项目中，克隆的文件，再压缩，并在本地使用它。

Answer 2:

为了得到多个div与lazyload工作，你必须明确地提了图像的容器的id。 当你有两个div #container1和#container2然后写：

$("#container1 img.lazy").lazyload({ container: $("#container1") });

$("#container2 img.lazy").lazyload({ container: $("#container2") });

相反的： $("img.lazy").lazyload({ container: $("#container1") });

$("img.lazy").lazyload({ container: $("#container2") });

文章来源: Multiple containers in Lazy Load