1

ユーザーがサイトに入ると読み込まれる50個のサムネイルのページがあります。

divを作成するloading...か、アニメーションGIFを使用して、サムネイル画像がまだ読み込まれていることを表示し、読み込まれた画像に切り替えることを検討しています。

純粋なJSまたはjQueryを使用するのに最適なオプションは何ですか?また、このようなものにどのようにアプローチしますか?

前もって感謝します

4

4 に答える 4

2

サムネイルの幅と高さは固定ですか?

さて、それを行う方法のアイデアは...

var loading = $('<img src="loading.gif" alt="loading" />');
$('#thumbnail').each(function(){
   var loadIMG = loading.clone();
   $(this).after(loadIMG).load(function(){
      $(this).show();
      loadIMG.hide();
   }).hide();
});

資力

于 2010-08-02T10:04:38.973 に答える
1

画像のロードイベントにバインドできます。

var img = new Image(640, 480); 
img.src = '...';
$(img).bind('load', function() { 
  // Has loaded
});

たぶん、各画像は内にありliます。liのクラスを持つ'sを使用してページをロードできますloading。CSSを使用してスタイルを設定し、読み込みビットを希望どおりに表示します。画像のイベントにバインドし、コールバックで親からクラスをload削除します。loadingli

于 2010-08-02T10:12:03.973 に答える
1

jQueryライブラリのオーバーヘッドを回避するために、純粋なjavascriptを使用できます。ただし、サイトですでに使用している場合は、使用してみてください。

于 2010-08-02T09:53:18.700 に答える
1

$(window).ready()の代わりに使用できます$(document).ready()documentDOM の準備ができたときに発生する場合は、windowすべての要素の準備ができたときに発生します。唯一のことは、外部ファイルがあり、サーバーが利用できない場合、スクリプトは実行されないということです.

于 2010-08-02T10:41:46.603 に答える