如何使用全球定時器的頁面

所有的JavaScript動畫在我的頁面，有幾個動畫（更改大小或backgroundColor使用定時器），聽說在一個頁面中使用太多的計時器將導致性能問題，和建議使用全局定時器。如何使用全球定時器的頁面

但動畫不是在同一時間開始的。

例如，我有兩個元素（ele1和ele2），它們的寬度每秒都會改變。

還有glboal計時器。

var timer=setInterval(animation,?); 

function animation(){ 
    //do ele1's animation 
    //do ele2's animation 
}

在0秒，用戶觸發ele1的動畫，並在0.5秒用戶觸發ele2。

現在，如何設置全球定時器的延遲？

1s？

如果是這樣，在1秒時，ele2的寬度將會改變，但是在1.5s時，定時器應該爲ele2做些事情，因爲ele2的動畫是在.5s觸發的，但是下一次定時器的發生將會是2s ，那麼如何解決它？

和想法？

來源

2011-12-26 hguser

您將不得不使用全局計時器與所有計時器的GCD。

如果您的計時器爲1.0和1.5，則可以爲0.5創建全局計時器，併爲調用全局計時器的次數維護一個全局變量。

var timerCount = 0 ; 
var timer=setInterval(animation,500); 

function animation(){ 

    // i.e. ele1TimerValue/globalTimerValue 
    if(timerCount%2) { 
     //do ele1's animation 
    } 

    if(timerCount%3) { 
     //do ele2's animation 
    } 
    ++timerCount; 
}

對於許多動畫，這將是更好地使用這個定時器作爲控制器用於調用相應的動畫（如ele1Animate()和ele2Animate()）。

來源

2011-12-26 14:13:29 Pradeep

但頁面中的動畫數量不確定，與延遲相同。 – hguser 2011-12-26 14:16:02

@hguser這就是我所說的，如果有多個定時器你必須採取他們所有的GCD。對於'1，1.5，2.5，5'它將是'0.5'。然後使用具有該值的全局計時器。由於編號將是GCD的倍數，您可以用這種格式編寫。 – Pradeep 2011-12-26 14:19:22

但我必須在第一次動畫開始時初始化計時器，此時，我不知道頁面上有多少動畫。 – hguser 2011-12-26 14:20:39

如何使用全球定時器的頁面

回答

相關問題