setInterval有时双倍

我用JQuery制作了一个幻灯片脚本，我使用的是setInterval（我也尝试过使用setTimeout也得到了同样的问题）。问题是，当我去一个新的标签，回到我的页面上幻灯片放映幻灯片似乎是以两倍的速度。有时它甚至减速并恢复到正常速度。我很困惑，为什么它这样做。请注意，我目前只在FF中尝试过。setInterval有时双倍

pictureAmount = 4; 
fadeSpeed = 600; 
delay = 6000; 
heightOfPicture = 320; //px 

function nextSlide(count) { 
    $('#slide-link').fadeOut(fadeSpeed, 'linear', function() { 
     document.getElementById('slide-link').style.backgroundPosition = '0 -' + (heightOfPicture * count) + 'px'; 
    }).fadeIn(fadeSpeed, 'linear'); 
} 

count = 0; 
window.setInterval(function() { 
    if (++count >= pictureAmount) count = 0; 

    nextSlide(count); 
}, delay);

这里是链接http://mprodesigns.com/new

来源

2011-07-04 Mike

我在Windows/FF5上试过这个，它以相同的速度运行。你有没有尝试从另一个浏览器/操作系统/计算机？ – Yousf

我也使用win7和FF5。我不知道为什么这是我的双倍超速，那么如果你的看起来很正常。也许留在新标签上一分钟或2分钟？我注意到了，当我去检查我的FB，然后回来工作 – Mike

你看到的是更新的浏览器中常见的（和相当新）行为。当页面处于非活动状态时，它们会减慢计时器。当你回到页面时，计时器“赶上”。

它有助于完全避免“setInterval（）”，而是使用“setTimeout（）”。让你自己的代码重新设置每次唤醒的超时时间。这样，你就不会有很多未决的处理程序调用来运行。

所以不是“的setInterval（）”，你可以这样做：

function timerHandler() { 
    if (++count >= pictureAmount) count = 0; 
    nextSlide(count); 
    setTimeout(timerHandler, delay); 
} 

setTimeout(timerHandler, delay);

的“减速”效应是由加大了最小延迟时间规定。通常，当你专注于窗口时，就像10或15毫秒。然而，当标签/窗口没有被聚焦时，它就像1000毫秒。

编辑 — Here is a demonstration page如果你离开的标签，并返回到它不应该表现出的异常加速。

来源

2011-07-04 14:35:44 Pointy

哦，这是完全无法避免的，或者有办法检查这些事件吗？ – Mike

你不能让浏览器不这样做，但你可以缓解这个问题。我会加上我的答案 - 给我一下。 – Pointy

好的，我怎么知道页面在睡觉？ – Mike

setInterval有时双倍

回答

相关问题