1

div次の例では、永遠に続くループをフェードインおよびフェードアウトしています。

function fadeOutFunc() {    
    $('.image-list .bottom').delay(5000).fadeOut(500).delay(5000).fadeIn(500,fadeOutFunc);
}
fadeOutFunc();

これは正常に機能していますが、少し変更する必要があります。divセレクターがターゲットとする4 つの s があります。現在のように、最初のアニメーションを 5 秒後に開始したいと考えています。ただし、2 番目は 6 秒後に、3 番目は 7 秒後に、4 番目は 8 秒後divにアニメーションを開始したいと考えています。divdiv

div最もスケーラブルなコードは、セレクターに一致するが 4 つ以上ある場合でも機能するコードです。

4

2 に答える 2

1

反復ごとにループして遅延を増やす必要があります。これを試して:

$('.image-list .bottom').each(function(i) {
    var initialDelay = i * 1000 + 5000;
    $(this).delay(initialDelay).fadeOut(500).delay(5000).fadeIn(500,fadeOutFunc);
});
于 2013-09-09T09:02:05.730 に答える
0

これを使用して遅延を定義します。

$('.image-list .bottom').each(function(index, item){ 
   var baseDelay = 5000;
   var delayDifference = 1000;
   delayForThisDiv = baseDelay + (index*delayDifference);
});
于 2013-09-09T09:03:19.120 に答える