当前位置:首页 »“秋了秋”个人博客 » 前端编程 » setInterval在切换浏览器标签页时的bug修复

setInterval在切换浏览器标签页时的bug修复

作者:秋了秋 发表时间:2016年03月17日

网页上做动画的时候,常常会碰到我去浏览其他页面再切换回来浏览动画页面的时候,发现动画变得迟钝了,才1秒没看,就变得懒洋洋的。

解决办法其实很简单,用两个窗口的事件window.onfocus和window.onblur分别对应窗口聚焦的时候和离开窗口的触发事件。在窗口聚焦时开启定时器,离开时关闭定时器,也省资源。而且还不会出现迟钝的现象:

var timer = setInterval(process);
window.onfocus=function(){
	timer=setInterval(process);
}
window.onblur=function(){
	clearInterval(timer);
}

这是原生js的解决办法,对于jq封装的动画方法animate可以在其前面加上stop得以解决:

$(obj).stop().animate({"left":"100px"});

这样的话无论你隔多久回来看,动画都是流畅的。

3
文章作者: “秋了秋”个人博客,本站鼓励原创。
转载请注明本文地址:http://www.mizuiren.com/blog/441.html
目录: 前端编程标签: setInterval 8271次阅读

请求播放音乐,请点击播放

登 录
点击获取验证码
还没账号?点击这里