Page Visibility实现焦点丢失提醒
来源:互联网 发布:最热网络词条 编辑:程序博客网 时间:2024/06/10 19:35
0.前言
HTML5 Page Visibility API是一个非常有用的特性,当页面对用户不可见时,暂停播放页面中的视频、动画、声音、以及其他耗费内存的操作,等用户回来时,再继续这些操作。当然,最好提醒下用户可以继续回到本页面上来,本文研究利用改变页面tab(title)实现提醒。
- 前言
- 效果预览
- 代码解析
- 实现过程
- 兼容性分析
- 学习资源
- 声明
效果预览
代码解析
实现过程
实现过程非常简单,侦听visibilitychange事件,然后改变页面标题。
var title = document.title,newTitle = "记得回来哟 " + title;document.addEventListener("visibilitychange", function() { document.title = ((document.hidden) ? newTitle : title);});
兼容性分析
来自caniuse的数据,Page Visibility在现代浏览器中兼容性不错,如下图所示。
学习资源
- Page Visibility参考手册
- Page Visibility兼容性表格
- Creating Well-Behaved Sites With The Page Visibility API
- Page Visibility(页面可见性) API介绍、微拓展
- Page Visibility API
- Using the Page Visibility API
声明
前端开发whqet,关注前端开发,分享相关资源。csdn专家博客,王海庆希望能对您有所帮助,限于作者水平有限,出错难免,欢迎拍砖!
欢迎任何形式的转载,烦请注明装载,保留本段文字。
本文原文链接,http://blog.csdn.net/whqet/article/details/44511735
欢迎大家访问独立博客http://whqet.github.io
10 0
- Page Visibility实现焦点丢失提醒
- Page Visibility实现焦点丢失提醒
- javascript Page Visibility API
- edittext突然丢失焦点
- Page Visibility API(页面是否可见)
- Page Visibility API 页面可见性
- 知识点:page visibility (页面可见性)
- Textbox获得焦点与丢失焦点
- 安装wampserver2.5提醒丢失msvcr110.dll
- visibility
- visibility
- UpdatePanel中Textbox焦点丢失解决方法
- TableCellEditor焦点离开数据丢失问题
- win7焦点总是不停丢失的解决方法
- mvvm 绑定textbox焦点丢失问题
- win7 64 位系统焦点丢失解决方案
- UILocalNotification 实现 本地 提醒
- Android实现定点提醒
- 130 个你需要了解的 vim 命令
- Recover Binary Search Tree
- Vim 练级攻略
- Merge Intervals
- vim 语法高亮
- Page Visibility实现焦点丢失提醒
- 编程之美链表题目总结
- JavaSE基础视频28_反射机制
- MOOC-Linux内核lab3 调试内核从start_kernel到init进程启动
- LeetCode(191) Number of 1 Bits
- ML主要数据集收藏
- vim note(5)
- ProjectNet源码编译与环境搭建
- java endorsed