0

スライドショーがあり、現在の画像がフェードアウトするときに次の画像をフェードインしたいと考えています。

それで、前の画像が完全にフェードアウトする前に次の画像をロードする方法はありますか?

これは私が使用しているものです:

    var aImages = new Array();
    var iPrev = -1;
    var iRnd = -1;
    aImages[0] = "01.jpg";
    aImages[1] = "02.jpg";
    aImages[2] = "03.jpg";
    aImages[3] = "04.jpg";
    aImages[4] = "05.jpg";
    aImages[5] = "06.jpg";
    $(document).ready(function() {
        $("img#bg").load(function()
            {
                $("img#bg").fadeTo(2000,1);
                setTimeout(function() 
                    {
                        $("img#bg").fadeOut(1000);
                        setTimeout(LoadImages,1000);
                    }
                    ,4000);
            }           
        )
        setTimeout(LoadImages,1000);
});
function LoadImage(iNr)
    {
        $("img#bg").attr("src", aImages[iNr]);      
};    
function LoadImages()
{
    while(iPrev == iRnd)
    {
        iRnd = Math.floor(Math.random()*aImages.length);
    }
    LoadImage(iRnd);
    iPrev = iRnd;
};
4

2 に答える 2

0

作業リンク: http: //jsfiddle.net/Ghokun/wnTte/13/ 画像を重ねるだけです。

以下の質問への回答でしたが、あなたにも役立つかもしれません

jQuery-次がフェードインを開始する前にdivが完全にフェードアウトしない

于 2012-04-11T18:16:53.977 に答える
0

この記事に示されているように、Javascript を使用して画像を事前に読み込むことができます。

于 2012-04-11T17:55:58.323 に答える