重置和循環jQuery的動畫

我動畫的一些HTML對象看起來像雪花飄落，但我有一些麻煩的循環。重置和循環jQuery的動畫

這裏是我的代碼：

//animation function 
function snowflakeAnimate(index) { 
    //random numbers 
    //time 
    var nTime = randomRange(9000,35000); 
    var randTime = Math.round(nTime); 

    //delay 
    var nDelay = randomRange(200,35000); 
    var randDelay = Math.round(nDelay); 

    $(this).delay(randDelay).animate({ 
     marginTop: "+600px" 
    }, randTime); 
}; 

$(".tweet").each(snowflakeAnimate);

因此，所有它是目前做的是通過增加上邊距爲600的延遲和動畫速度動畫雪花是通過產生一個隨機數設置。我的問題是如何將雪花重置到頂部，然後再次運行動畫，以便它永不停止。

來源

2011-11-25 Forxs

你想要做的事情是這樣的：http://www.somethinghitme.com/2010/04/29/jquery-snowfall-plugin-1- 3 /？ –

@BookOfZeus是誰寫的那個插件是friggin令人驚歎！：P – Loktar

我認爲The jQuery animate() step callback function是你的朋友在這裏。

來源

2011-11-25 14:46:35

謝謝你，但我無法讓它循環...只是重置。我現在所做的就是安裝[Jquery Timers插件]（http://jquery.offput.ca/js/jquery.timers.js），做到了這一點。 – Forxs

我這是怎麼做的 - 只是要得到函數調用本身的語法正確的...

function snowflakeAnimate(sfAnimate) { 

     //Animation 
     $(sfAnimate).addClass("moving").delay(randDelay).animate({ 
      marginTop: 600 
     }, 20000, function() { 
      $(sfAnimate).animate({ 
       marginTop: -150 
      }, 0, function() { 
       snowflakeAnimate(sfAnimate); 
      }); 
     }); 
}

所以有它...一個無限循環動畫。如果你想看到它的行動，你可以檢查它在traxmas.realadventure.co.uk

來源

2011-12-16 14:46:26 Forxs

很酷的頁面伴侶，做得很好 – martincarlin87

重置和循環jQuery的動畫

回答

相關問題