2012-07-07 9 views
6

Lazy Load pluginを複数のコンテナに適用しようとしています。私はこの類似の質問を発見した:Lazy Load on MULTIPLE horizontal containers遅延ロードの複数のコンテナ

この

は私の試みです: http://jsfiddle.net/BAFMC/

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

しかし、私は怠惰な負荷だけで三番目で最後の容器(.p_outer_content)(に適用されるということである述べた質問と同じ問題を抱えていますフィドル)。

これを解決する方法を知っている人や、他の提案がありますか?

[OK]を、私はコンテナのいずれかがスクロールされるたびlazyload機能を再適用することを試みた:EDIT

事前」内の おかげで動作します

$(".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/

、私はそれを解決する良い方法かどうかわかりません。だれもがよりよい解決策を考え出していますか?ありがとう '

+1

バグは1.8.0で修正されています。 –

+0

ありがとう!これを聞いてうれしいです。 – Alvaro

答えて

5

LazyLoadプラグインにバグがあります。カスタムコンテナを提供すると、グローバル変数リークが発生しました。私はこのフォークに必要最小限の修正を加えました。

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

はここで働いてデモhttp://jsfiddle.net/BAFMC/5/

だ私はその一例で直接githubのRAWファイルを使用しますが、あなたのプロジェクトで、ファイルのクローンを作成、それを縮小化し、それをローカルに使用しています。

+0

ありがとうございました ' – Alvaro

+0

ありがとうございました! –

+2

jsのフィドルでは、すべての画像は灰色のままです。コードはまだ有効ですか? –

3

複数のdivがlazyloadで動作するようにするには、画像のコンテナIDを明示的に指定する必要があります。あなたは2つの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") });