1

私は4つの画像のエンドレススライドショーを作成しました。これは、各画像をクロスフェードし、短時間一時停止することで、多かれ少なかれうまく機能します（以下のコード）。次に、無限ループで繰り返します。しかし、移行のタイミングは必ずしも同じではないことに気づきました。また、slides（）関数内でslides（）関数を呼び出すことで、これを最善の方法で実行したかどうかもわかりません。おそらくそれがタイミングの不一致の原因ですか？このコードをどのように最適化しますか？これは無限のスライドショーでなければならないことを覚えておいてください。前もって感謝します。

slides();

function slides() {
    $('#slide1').fadeTo(1200, 1).fadeTo(3000, 1, function () {
        $('#slide1').animate({
            opacity: 0
        }, 1500);
        $('#slide2').fadeIn(1500).fadeTo(3500, 1, function () {
            $('#slide2').animate({
                opacity: 0
            }, 1500);
            $('#slide3').fadeIn(1500).fadeTo(3500, 1, function () {
                $('#slide3').animate({
                    opacity: 0
                }, 1500);
                $('#slide4').fadeIn(1500).fadeTo(3500, 1, function () {
                    $('#slide4').animate({
                        opacity: 0
                    }, 1500);
                    slides();
                });
            });
        });

    });

}
4

1 に答える 1

0 
slide(1);

function slide(n) {
  $('#slide' + n).fadeTo(1200, 1).fadeTo(3000, 1, function () {
        $('#slide' + n).animate({
            opacity: 0
        }, 1500);
        slide((n % 4) + 1);
  });
}
于 2010-09-20T03:07:10.223 に答える