1

たとえばjQueryプラグインとしてスライドショーウィジェットを探しています。概略的にどのように見えるか(点線の長方形は最初は表示されない画像であり、矢印ボタンによるナビゲーション):

....  ....       +--+  +--+  +--+       ....  ....
.  .  .  .  [<]  |  |  |  |  |  |  [>]  .  .  .  .
....  ....       +--+  +--+  +--+       ....  ....

要件:

  • 表示されている3つの画像は、できるだけ早く読み込む必要があります。

  • 通常の遅延読み込みはありません:最初は非表示の画像が自動的に読み込まれ、すべての表示画像が読み込まれた後すぐに読み込まれます。

アイデア:最初のページの読み込みが速く、帯域幅を最適に使用し、不要な待機時間をなくします。

提案?

4

1 に答える 1

2

ページの読み込み後に非表示の画像にソースを追加できます。

隠し画像: <img data-src="/images/image1.jpg">

ページの読み込み後、次のように実行します。

$(function () {
   $('img[data-src]').each(function () {
       var hImg = $(this),
           src = hImg.attr('data-src');

       hImg.attr('src', src);
   });
});

もちろん、スライド ショー プラグインは、この document.ready 関数の後にのみ含める必要があります。

于 2013-01-15T11:33:50.663 に答える