0

巨大な画像を含む 5 つのフレーム (それぞれに独自の画像のスライドショーがあります) のスライドショーを作成していますが、各フレームの最初のいくつかの画像が読み込まれるまでに時間がかかります (残りの画像は非常に高速に読み込まれます)。 ）。そのため、単純な黒い画像 (背景は黒) をプリロードし、画像が読み込まれたことがわかったらスライドショーを開始できると考えていました。また、スライドショーの画像は動的です。つまり、URL は毎日変わります。

どうすればそれができるか知っている人はいますか？私がオンラインで見つけたものは、画像をプリロードするだけで、その後スライドショーを開始する方法については何も言っていないからです.

または、より良い解決策がある場合は、お知らせください。

参考までに、スライドショーでは、PHP を使用して画像の URL をファイルに抽出し、JavaScript を使用してそれらを読み取り、スライドショーに表示しました。

ありがとう！

4

3 に答える 3

0

「ポール アイリッシュによると、画像の読み込み完了イベントを検出するための正規のプラグインは現在、次の場所にあります。

https://github.com/desandro/imagesloaded」

ソース:読み込まれた画像の jQuery イベント

于 2013-03-27T14:41:54.460 に答える
0

画像をプリロードする良い方法は、css で position: absolute を使用してフレームの外側に画像をロードすることです。Safari ではダウンロードされません。

これは、画像をプリキャッシュするエレガントな方法のようです。

于 2013-03-27T14:39:26.170 に答える
0

これはうまくいくはずです

/*You could populate this array through an xml to something if there are too many images*/
var arrUrls = ["image1.jpg", "image2.jpg", "image3.jpg"];
var nLoadCount = 0;
for(var i=0;i<arrUrls.length;i++)
{
    var oImage = new Image ();
    oImage.onload = function ()
    {
        nLoadCount++;
        if(nLoadCount == arrUrls.length)
        {
            /*Show your content here*/
        }
    }
    oImage.src = arrUrls[i];
}
于 2013-03-27T14:55:59.857 に答える