来自另一个选项卡时，Jquery setInterval太快
我有一个使用jquery的setIntervall（）函数无限滑动图像的网站。
在Chrome 13中调用该页面时，我切换到另一个选项卡几秒钟后返回，图像滑动发生得更快，好像它试图跟上它没有切换到另一个选项卡的位置。
我该如何解决这个问题？
$(window).load(function() { setInterval(nextSlide, 3500); }); function nextSlide(){ offset += delta; $("#slideContent").animate({left: -1 * offset}, 1000); } 解：
我选择了jfriend00的第一个建议。 现在我在窗口变为非活动状态时关闭计时器。
可以在这里找到这样做的简单代码。
一开始我想为所有的错误道歉 – 我的英语并不完美。
您的问题的解决方案可能非常简单：
$(window).load(function() { setInterval(nextSlide, 3500); }); function nextSlide(){ offset += delta; $("#slideContent").stop(true,true).animate({left: -1 * offset}, 1000); }
非活动浏览器选项卡缓冲一些setInterval或setTimeout函数。 stop（true，true） – 将停止所有缓冲的事件并仅执行immadietly上一次动画。 Firefox> 5.0中也会出现此问题 – 阅读本文： Firefox 5 – 更改
window.setTimeout（）方法现在钳制在非活动选项卡中每秒发送不超过一次超时。 此外，它现在将嵌套超时限制为HTML5规范允许的最小值：4 ms（而不是用于钳位的10 ms）。
在这里你可以阅读，动画如何工作 – 它多次触发setInterval函数。 动画如何在jQuery中真正起作用
当选项卡页面在后台时，最新版本的Chrome显然会减慢setInterval的操作，然后当您将该页面向前移动时，它会尝试赶上。
在Chromium博客上，Google表示：
在即将发布的Chrome 11版本中，我们计划减少CPU消耗，即使对于使用setTimeout和setInterval的页面也是如此。 对于后台选项卡，我们打算每秒运行每个独立计时器不超过一次。 此更改已在Chrome开发者频道和金丝雀版本中实施。
您的间隔是3.5秒，但动画本身可能使用更短的计时器。
解决问题的可能方法：
- 窗口不可见时停止计时器/动画。 窗口变为可见时重新启动计时器/动画。
- 而不是setInterval，使用setTimeout，然后每次触发时重置setTimeout以创建自己的重复间隔 – 尽管在你的情况下，可能是jQuery使用定时器是问题 – 我不知道。
- 减慢你的计时器，这样他们就不会碰到这个（再次可能是jQuery内部而不是你自己的计时器）。
最好的选择可能是找出何时停止然后重新启动动画。
类似的问题： Chrome：超时/间隔在后台标签中暂停？ 。
仅供参考，Chrome提供了用于检测网页可见性的新实验API。 您可以在此处阅读相关内容： http ： //code.google.com/chrome/whitepapers/pagevisibility.html 。 当您的页面可见但没有焦点时，它有助于解决问题。
嘿，你在使用Jquery 1.6吗？
这可能是原因，因为1.6使用requestAnimationFrame进行动画制作。 您可能需要检查此页面以替换setInterval，clearInterval
http://blog.blenderbox.com/2011/06/24/jquery-1-6-1-and-setinterval/
代码： https ：//gist.github.com/1002116 [编辑：更新源代码，edit2：由于firefox错误，目前无法使用firefox。 – 我已经降级到JQuery 1.5]
来自博主：
然后，在调用setInterval（func，poll）的地方，现在调用requestInterval（func，poll）。 在你调用clearInterval（interval）的地方，你现在调用clearRequestInterval（interval）;
您是否尝试过根本不使用setInterval或setTimeout ，只是使用animate函数的completefunction来启动下一张幻灯片？ delay函数设置为2500（即，从setInterval的3500中减去的animate为1000）。 我没有尝试使用Chrome，所以如果有效，请告诉我。
var slider = function(n){ $("#slideContent").delay(2500).animate({left: -1 * n * delta}, 1000, function(){slider(n+1)} ); }; slider(1);
尝试setInterval()它的工作原理