動畫在一段時間後開始移動

Question

我正在設計一個帶有jQuery動畫效果的div的頁面。這包括移動div並縮放它們（通過在.animate（）參數中設置寬度和高度）。在使用我的MacBook的動畫中，我沒有發現使用Chrome和Firefox的任何缺陷，但是我被告知，如果該頁面單獨保留8-10分鐘，則div開始移出位置。

1. 這怎麼可能？難道在較慢的計算機上，動畫不會同步？我在同一時間爲5個div製作動畫，並且爲動畫的迴歸設置了一個內部（每8秒），並且我還將動畫速度設置爲較慢。

2. 我動畫的東西像left += 200px而不是例如left = 450px因爲在Firefox中所有的div會跳到屏幕左側的div，其中一些跳躍到目前爲止離開他們走出屏幕。

   我想這是因爲我使用的是父容器div來包含移動的div並使用margin-left: auto; margin-right:auto居中這個div容器和設置動畫的div的left屬性時，火狐將它們視爲之初有left:0動畫。我將容器div的位置設置爲相對的，但將動畫的div設置爲絕對的（因爲我不希望它們干擾彼此的位置）。有沒有更好的方法來做到這一點？

Answer 1

你可以用更少的代碼和更少的頭痛來做到這一點。在班

.tablet1{ 
    height:100px; 
    width:140px; 
    margin-left:-540px; 
    top: 200px; 
    z-index:10; 
} 

2.使用普通函數來處理所有的過渡

1.商店平板電腦位置屬性。如果你使用switchClass

switchTabletsRight = function(){ 
    var i, next, max = 5; 
    for(i = 1; i <= max; i++){ 
    next = (i < max)? i + 1 : 1; 
    $(".tablet" + i).switchClass("tablet" + i, "tablet" + next); 
    } 
};​ 

3.調用與setInterval的一般功能

JQuery用戶界面會爲你做所有的工作。

var loop = setInterval(function(){ 
    switchTabletsRight(); 
},2000); 

這裏的概念證明的jsfiddle：http://jsfiddle.net/nRHag/6/