来自另一个选项卡时,Jquery setInterval太快

Jan*_*ann 10 javascript jquery google-chrome setinterval

我有一个使用jquery的setIntervall()函数无限滑动图像的网站.

在Chrome 13中调用页面时,我切换到另一个选项卡几秒钟后返回,图像滑动发生得更快,好像它试图保持到原来的状态,如果它没有切换到另一个选项卡.

我该如何解决这个问题?

$(window).load(function() { 
    setInterval(nextSlide, 3500);
});

function nextSlide(){   
    offset += delta;
    $("#slideContent").animate({left: -1 * offset}, 1000);
}
Run Code Online (Sandbox Code Playgroud)

解:

我选择了jfriend00的第一个建议.现在,当窗口变为非活动状态时,我会关闭计时器.

可以在这里找到这样做的简单代码.

小智 16

一开始我想为所有的错误道歉 - 我的英语并不完美.

您的问题的解决方案可能非常简单:

$(window).load(function() { 
    setInterval(nextSlide, 3500);
});

function nextSlide(){   
    offset += delta;
    $("#slideContent").stop(true,true).animate({left: -1 * offset}, 1000);
}
Run Code Online (Sandbox Code Playgroud)

非活动浏览器选项卡缓冲一些setInterval或setTimeout函数.stop(true,true) - 将停止所有缓冲的事件并仅执行immadietly上一次动画.Firefox> 5.0中也会出现此问题 - 阅读本文:Firefox 5 - 更改

window.setTimeout()方法现在钳制在非活动选项卡中每秒发送不超过一次超时.此外,它现在将嵌套超时限制为HTML5规范允许的最小值:4 ms(而不是用于钳位的10 ms).

在这里你可以阅读,动画如何工作 - 它多次触发setInterval函数.动画如何在jQuery中真正起作用