jQuery的動畫（）失敗

我寫這篇文章的代碼（我simplyfied吧）jQuery的動畫（）失敗

function flip(i) { 
    setTimeout(function() { 
     $("#block-"+i).css("transform","rotateY(10deg)"); 
    }, i*200); 
} 

$("#flip").click(function() { 
    for (i=1;i<=6;i++) { 
     flip(i); 
     $("#block-"+i).delay(i*200+1400).animate({left:100},500); 
    } 

    $("#text-1").delay(3000).animate({top:200},4000,"swing",function(){ 
     $("#block-1").animate({top:500},1000); 
    }); 
});

我知道有使用的setTimeout（）在循環中的一些問題，但問題是line

$（「＃block-1」）。animate（{top：500}，1000）;

它不動畫.. 當我試圖把它拿出來的回調，這樣

function flip(i) { 
    setTimeout(function() { 
     $("#block-"+i).css("transform","rotateY(10deg)"); 
    }, i*200); 
} 

$("#flip").click(function() { 
    for (i=1;i<=6;i++) { 
     flip(i); 
     $("#block-"+i).delay(i*200+1400).animate({left:100},500); 
    } 

    $("#text-1").delay(3000).animate({top:200},4000); 
    $("#block-1").delay(7000).animate({top:500},1000); 
});

I'T工作了，但我要補充的延遲（）實際的代碼包含一些排隊的動畫元素，所以我必須計算每個延遲，這是如此討厭.. 有沒有解決這個問題？

來源

2015-10-05 Dedi Suhaidi

你可以發佈jsFiddle這個的？另外，你是否願意嘗試其他JS庫，僅僅爲了這個和相關的動畫目的而沒有太多的開銷？ –

這很有趣...我做了jsfidle http://jsfiddle.net/deddot/209rdo03/3/和它的作品...也許我削減了代碼太多.. –

** [This]（http：// jsfiddle.net/tahirahmed/yj85c4w2/)**是我能夠製作的，出於興趣，使用** [TweenMax]（http://greensock.com/gsap）**。 –

ahhh。只是忘了它..我重寫代碼，修復問題，但仍然不知道什麼是錯誤的.. 實際上新的代碼有另一個問題..但這是另一個話題..

來源

2015-10-08 19:15:52

jQuery的動畫（）失敗

回答

相關問題