0

ユーザーが下にスクロールしたときに表示できるように、5〜6枚の画像をプリロードしたい(facebook-like-auto-load-on-scroll)。そのため、ユーザーが下にスクロールすると、それ以上読み込まずに画像が表示されます。以前に次の CSS コードを使用しました。

img.not-load
{
 display:none;
}

というわけで、jQueryを使うと見えるようにしたら、ロードせずに出てきました。しかし問題は、ページの読み込み時間が増加したことです。jQuery を使用して、ページ全体が読み込まれた後にのみ画像を読み込みたいと考えています。jQuery を使用してみ$(document).ready(function(){ ... });ましたが、ほとんど同じように機能しました。つまり、ページの読み込み中に必要な画像を読み込みます。私の問題を理解していただければ幸いです。私は jQuery の初心者であり、先に進むための手がかりが必要です。事前にご協力をお願いいたします...

4

3 に答える 3

1

試みたようなもの$(window).on('load')ではなく、イベントを使用します。$(document).ready()

これは、トリガーする前に、ページ上のすべての要素が読み込まれるのを待ちます。

$(window).on('load', function() { 
   // Perform tasks after everything has loaded.
});
于 2013-06-18T12:46:36.613 に答える
0

必要なのは、このように img タグを lazyload でリメイクすることです

 <img class="lazy" src="img/grey.gif" data-original="img/example.jpg" width="640" height="480">

そしてjavascriptを追加

  $("img.lazy").lazyload();

http://www.appelsiini.net/projects/lazyload

于 2013-06-18T12:49:41.060 に答える