我setInterval每秒运行一段代码30次.这很好用,但是当我选择另一个选项卡(以便我的代码的选项卡变为非活动状态)时,由于setInterval某种原因将其设置为空闲状态.
我做了这个简化的测试用例(http://jsfiddle.net/7f6DX/3/):
var $div = $('div');
var a = 0;
setInterval(function() {
a++;
$div.css("left", a)
}, 1000 / 30);
Run Code Online (Sandbox Code Playgroud)
如果您运行此代码然后切换到另一个选项卡,等待几秒钟然后返回,动画将继续在您切换到另一个选项卡时的位置.因此,如果选项卡处于非活动状态,则动画不会每秒运行30次.这可以通过计算setInterval每秒调用函数的次数来确认- 如果选项卡处于非活动状态,则不会是30,而只是1或2.
我想这是通过设计完成的,以提高性能,但有没有办法禁用这种行为?在我的场景中,它实际上是一个缺点.
我需要知道用户当前是否正在Google Chrome中查看标签.我试图将事件模糊和焦点绑定到窗口,但只有模糊似乎正常工作.
window.addEventListener('focus', function() {
document.title = 'focused';
});
window.addEventListener('blur', function() {
document.title = 'not focused';
});
Run Code Online (Sandbox Code Playgroud)
焦点事件很奇怪,只是有时候.如果我切换到另一个选项卡并返回,焦点事件将不会激活.但是,如果我点击地址栏然后返回页面,它就会.或者,如果我切换到另一个程序然后返回到Chrome,则会激活该选项卡当前是否已关注.
我想学习如何使用谷歌Chrome浏览器动态更新图标,我注意到浏览器似乎限制了每秒更新图标的频率,这种情况看起来很邋.. 我为此做的测试页面是:
http://staticadmin.com/countdown.html
这只是一个显示倒计时结果的滚动消息.我添加了一个输入字段来调整脚本每秒移动多少像素,我在谷歌浏览器中平滑地将最大值调整为每秒约5帧,我还没有在任何其他浏览器中测试它.
我的问题是最大频率是多少,有没有办法改变它,背后有什么特别的原因吗?
注意:我也注意到这个值也会根据窗口焦点而改变.当浏览器的窗口不在焦点时,它似乎降至每秒约1次更新,并在返回时返回"max".