jQuery的：動畫與第一去到最後，每次開始啓動動畫45ms列表中的上一個李開始

http://jsfiddle.net/nicktheandroid/QSdUz/5/jQuery的：動畫與第一去到最後，每次開始啓動動畫45ms列表中的上一個李開始

我有李的名單後，我試圖讓他們動畫向右15px，完成。問題是，我希望第一個開始，然後45毫秒後再接下來的LI動畫（第一個LI將在下一個動畫開始時處於中間動畫中），直到它完成所有動畫。現在它等到第一個完成，然後動畫下一個，這是錯誤的。

任何人都可以告訴我如何糾正這個功能是我上面描述的？

$('UL').hover(function(){ 

    doSlide($('UL li:first')) 

}, function() { 

    doReverseSlide($('UL li:first')) 

}) 

function doSlide(current) { 
    $(current).animate({ 
     right:0 
    },200).delay(45, function(){ 
      doSlide($(current).next('li'));   
    }) 


}

來源

2011-07-08 android.nick

function doSlide(current) { 
    $(current).animate({ 
     right:0 
    },200); 
    // mix some javascript in with your jQuery ;) 
    setTimeout(function(){ 
      doSlide($(current).next('li'));   
    },45); 
}

http://jsfiddle.net/QSdUz/6/

與反向

http://jsfiddle.net/QSdUz/7/

...我喜歡的效果。可能自己使用它來做某件事。

來源

2011-07-08 10:43:46

真棒，你可以看看我做的編輯，並告訴我爲什麼現在只做最後一個？我嘗試在函數的「當前」旁邊添加另一個變量，以便我可以更改其動畫的像素數量，所以我不必製作2個函數，但是我做錯了什麼。 http://jsfiddle.net/nicktheandroid/QSdUz/9/ –

http://jsfiddle.net/QSdUz/10/ –

你可以一次完成，計劃使用增加的延遲，像所有的動畫：

function doSlide() { 
    window.slideOffset = 0; 
    jQuery.each($("li"), function() { 
     setTimeout($(this).animate, window.slideOffset, {right:0}, 200); 
     window.slideOffset += 45; 
    }); 
}

注意，這可能需要修補setTimeout()在IE中正常工作，如所描述here。

來源

2011-07-08 10:45:15 aroth

jQuery的：動畫與第一去到最後，每次開始啓動動畫45ms列表中的上一個李開始

回答

相關問題