visibilitychange事件判断当前页面——可见性的状态
来源:互联网 发布:免费电子期刊制作软件 编辑:程序博客网 时间:2024/05/22 12:08
转载自 : http://www.webhek.com/post/page-visibility.html
document.hidden
这个新出现的document.hidden
属性,它显示页面是否为用户当前观看的页面,值为ture或false。
document.visibilityState
visibilityState
的值要么是visible
(表明页面为浏览器当前激活tab,而且窗口不是最小化状态),要么是hidden
(页面不是当前激活tab页面,或者窗口最小化了。),或者prerender
(页面在重新生成,对用户不可见。).
visibilitychange事件
监听页面可见性变化非常容易:
// 各种浏览器兼容var hidden, state, visibilityChange; if (typeof document.hidden !== "undefined") {hidden = "hidden";visibilityChange = "visibilitychange";state = "visibilityState";} else if (typeof document.mozHidden !== "undefined") {hidden = "mozHidden";visibilityChange = "mozvisibilitychange";state = "mozVisibilityState";} else if (typeof document.msHidden !== "undefined") {hidden = "msHidden";visibilityChange = "msvisibilitychange";state = "msVisibilityState";} else if (typeof document.webkitHidden !== "undefined") {hidden = "webkitHidden";visibilityChange = "webkitvisibilitychange";state = "webkitVisibilityState";}// 添加监听器,在title里显示状态变化document.addEventListener(visibilityChange, function() {document.title = document[state];}, false);// 初始化document.title = document[state];
上面的代码会在页面可见性发生变化时修改document.title
的值!
那么,什么时候需要使用visibilitychange
事件呢?比如,如果你的页面上有嵌入视频正在播放,当用户切换到其它标签页时,你的标签页上的视频应自动暂停播放,当用户切换回来时继续接着播放。再比如,如果你的页面有自动刷新动作,当用户切换到其它标签页时,你就应该停止刷新,而当用户切换回来时继续之前的动作。
需要注意的是: 页面跳转之后的返回当前页不会触发本事件
阅读全文
0 0
- visibilitychange事件判断当前页面——可见性的状态
- HTML5事件—visibilitychange 页面可见性改变事件
- 页面可见性改变事件 : visibilitychange
- HTML5事件——visibilitychange 标签可见性
- HTML5 API --- 页面可见性改变(visibilitychange)事件
- HTML5 API --- 页面可见性改变(visibilitychange)事件
- HTML5——visibilitychange 标签可见性
- 当前网页关闭事件拦截onbeforeunload ,visibilitychange
- 当前窗口获得焦点js事件【visibilitychange】
- Fragment可见状态的判断
- html5新功能2—使用HTML5里页面可见性接口判断用户是否正在观看你的页面
- selenium +python 判断当前页面某一元素的状态
- 页面隐藏的黑科技-visibilitychange
- 如何判断当前的Fragment是否可见?Fragment的可见与不可见的判断方法。
- 判断当前连接的状态
- 判断当前的网络状态
- 判断当前网络的状态
- html5 visibilitychange事件
- java之extends关键字
- Elasticsearch(搜索(2)--基本的工具)
- log4net之syslog和logstash结合
- 友元函数和友元类
- jquery获取,改变页面内容
- visibilitychange事件判断当前页面——可见性的状态
- Mysql ubuntu 定时备份
- 使用guest用户远程连接RabbitMQ用户名密码错误
- SSM项目从零开始到入门003-maven集中定义依赖版本号
- 标题带"精""热"。ReplacementSpan实践
- 两年Java开发工作经验面试总结
- linux下,用终端打开软件,例如matlab,如何解除终端占用
- Android 手势检测---GestureDetector
- MVC框架集成