web 页面执行animate等动画时 浏览器失焦后 动画加速问题

参考了网上的内容
知识点为:
document.onvisibilitychange
只要页面发生变化,不管是切换到其他的页面还是把浏览器缩小,都会触发这个事件
document.hidden
这个是指当页面不是当前页面时为true,否则为false
document.visibilityState
这个属性有四个值:visible, hidden, prerender, unloaded
visible: 表示当前网页是可见或者是部分可见的
hidden: 当前网页是不可见的
prerender: 网页内容被预渲染并且用户不可见
unloaded: 如果文档被卸载,那么这个值将被返回

处理方法一般如下
JS:

document.onvisibilitychange = function () {
  if (document.visibilityState == 'visible') {
    timer = setInterval(slidemove, 1000)
  } else {
    clearInterval(timer)
  }
}

JQ:

// 在animate方法前加上stop方法
$(xxx).stop(true, true).animate({ ... })
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。