jQuery setInterval（）的問題？

Question

我有用jQuery構建的圖像滑塊。它被設置爲以7000毫秒的間隔滑動圖像。看起來，有時並且有時候，滑塊將以超高速度滑動圖像（滑塊之間的間隔約爲1秒）。我無法確定原因。請幫忙！

鏈接到的網站與滑塊：http://healthyhometech.com

function slider() { 
     $(".paging").hide(); 
     $(".paging a:first").addClass("active"); 

     var imageWidth = $(".window").width(); 
     var imageSum = $(".image_reel img").size(); 
     var imageReelWidth = imageWidth * imageSum; 

     $(".image_reel").css({'width' : imageReelWidth}); 

     rotate = function(){ 
      var triggerID = $active.attr("rel") - 1; 
      var image_reelPosition = triggerID * imageWidth; 

      $(".paging a").removeClass('active'); 
      $active.addClass('active'); 

      $(".image_reel").animate({ 
      left: -image_reelPosition 
      }, 500); 

     }; 

     rotateSwitch = function(){ 
      play = setInterval(function(){ 
      $active = $('.paging a.active').next(); 
       if ($active.length === 0) { 
       $active = $('.paging a:first'); 
      } 

       rotate(); 
      }, 7000); //Timer speed 
     }; 

     rotateSwitch(); 

     $(".image_reel a").hover(function() { 
     clearInterval(play); 
     }, function() { 
     rotateSwitch(); 
     }); 


    }; 

Answer 1

沒有與setInterval的一個關鍵問題：它保留在內存中！因此，有機會，你刷新頁面，同時測試，因此，創造同樣的程序不同的setInterval因此，有時候，你看到程序執行被更快的方式（實際上是的setInterval發生多次）。

我是能夠通過使用VAR「我的間隔」 = setInterval的，解決類似的問題，之前運行的setInterval，檢查如果它存在（不爲零）。如果是這樣，殺了它或根本沒有[運行]：

var myInterval; 
if (myInteval == undefined) myInterval = setInterval(function() { 
    ... 
    myInterval=12345; 
},..); 

Answer 2

嘗試在代碼的下面部分增加時間值：

$(".image_reel").animate({ 
     left: -image_reelPosition 
     }, 500); //Here increase the value 500 to a value suitable to you, for example 1000, 2000 etc. anything you like. 

值有以毫秒爲單位，並且限定動畫速度。

[編輯]

好了，從我觀察到的是什麼，我想你，只有當你離開網頁的標籤頁中打開，並繼續其他選項卡上的工作得到快速滑動的問題，那麼當您返回到包含該頁面的選項卡，可快速滑動圖像。如果你留在選項卡上，它不會發生。我的猜測是，你在的Chrome瀏覽器注意到這個問題。

似乎是在腳本沒有問題，只有Chrome瀏覽器的工作方式。如果您在後臺留下選項卡，chrome可能會暫停setInterval（）函數，並且當您返回到頁面時，它會在後臺運行它的時間量。所以這可能是Chrome瀏覽器的工作方式。代碼沒問題。