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://netblog.cn/blog/441.html