document.visibilityState 监听浏览器最小化
document.hidden:表示页面是否隐藏的布尔值。页面隐藏包括 页面在后台标签页中 或者 浏览器最小化 (注意,页面被其他软件遮盖并不算隐藏,比如打开的 sublime 遮住了浏览器)。
document.visibilityState:表示下面 4 个可能状态的值
hidden:页面在后台标签页中或者浏览器最小化
visible:页面在前台标签页中
prerender:页面在屏幕外执行预渲染处理 document.hidden 的值为 true
unloaded:页面正在从内存中卸载
Visibilitychange事件:当文档从可见变为不可见或者从不可见变为可见时,会触发该事件。
这样,我们可以监听 Visibilitychange 事件,当该事件触发时,获取 document.hidden 的值,根据该值进行页面一些事件的处理。
1 document.addEventListener('visibilitychange', function() {
2 var isHidden = document.hidden;
3 if (isHidden) {
4 document.title = '当焦点不在当前窗口时的网页标题';
5 } else {
6 document.title = '再变回来或者做点其他的';
7 }
8 });
只要懂得了原理, 怎么做都随你!~
document.visibilityState 监听浏览器最小化的更多相关文章
- document.visibilityState 监听浏览器
document.hidden:表示页面是否隐藏的布尔值.页面隐藏包括 页面在后台标签页中 或者 浏览器最小化 (注意,页面被其他软件遮盖并不算隐藏,比如打开的 sublime 遮住了浏览器). do ...
- js监听浏览器tab窗口切换
js监听浏览器tab窗口切换 ——IT唐伯虎 摘要:js监听浏览器tab窗口切换. if (document.hidden !== undefined) { document.addEventLis ...
- 监听浏览器tab切换
监听浏览器切屏 为了完成验证用户在切换浏览器tab时进行登录再次认证需求需要监听浏览器切换窗口 if (document.hidden !== undefined) { document.addEve ...
- 【hugo】- hugo 监听浏览器切换title
hugo 博客 监听浏览器title 动态改变浏览器title标题 找到head.html themes/maupassant/layouts/partials/head.html 添加监听js 可以 ...
- JS实时监听浏览器宽度的变化
boot:function(){ //加载页面时执行一次 changeMargin(); //监听浏览器宽度的改变 window.onresize = function(){ changeMargin ...
- vue监听浏览器窗口大小变化
首先,页面初始化mounted的时候,通过 document.body.clientWidth 和 document.body.clientHeight 来获取到浏览器的宽和高,然后通过 window ...
- vue JS实现监听浏览器返回按键事件
// 这个是监听浏览器回退键的returnButton () { let vm = this; $(document).ready(function () { if (window.history & ...
- JS监听浏览器标签页的显示与隐藏
/** * 监听浏览器标签页的显示与隐藏 */ class ListenerPageVisibility { constructor () { // 设置隐藏属性和改变可见属性的事件的名称 this. ...
- JS 监听浏览器各个标签间的切换
以前看到过一些网页,在标签切换到其它地址时,网页上的标题上会发生变化,一直不知道这个是怎么做的,最近查了一些资料才发现有一个 visibilitychange 事件就可以搞定,这里将介绍一下页面可见性 ...
随机推荐
- pyqt5加载网路图片,不本地下载。
依赖组件: requests class webImg: pass if __name__ == '__main__': import sys from PyQt5.QtWidgets import ...
- TensorFlow-GPU:查看电脑显卡型号是否支持CUDN,以及相关软件下载与介绍
1.显卡(GPU)是否支持CUDN https://developer.nvidia.com/cuda-gpus 2.了解基础知识 1)CUDA(Compute Unified Device Arch ...
- ubuntu下安装和配置apache2+SVN的详细方法介绍
ubuntu安装和配置SVN第一步:安装apache2 libapache2-svn subversionsudo apt-get install apache2sudo apt-get insta ...
- php 获取某文件内容
获取某文件下 的文件夹和文件 public function dirRead($dir=''){ //$dir = './upload/images'; $result = ''; if (is_di ...
- multiselect2side:jQuery多选列表框插件
http://blog.csdn.net/rosanu_blog/article/details/8550723 http://www.bkjia.com/jQuery/449193.html < ...
- chrome二维码插件 – w3cways QR Code Generator
最近研究了下Chrome插件的制作方法,制作了一个二维码插件. 安装方法 方法一:在Chrome应用商店中安装(推荐)点击安装(需FQ) 方法二:本地安装:下载安装包,解压得到w3cways_qrCo ...
- Centos修改时间显示的时区,将UTC修改为CST
问题说明: 今天一同事反应,系统的时间不对和正常的时间差8个小时.就登录主机看了下时间 系统时间显示为: # date Fri Dec :: UTC # 备注:查看了下,正好和当前的时间差了8个小时. ...
- mysql中已经存在某个库中有大小写的表,将lower_case_table_names由0改为1对已经存在的表是否有影响?
需求描述: 今天遇到了修改lower_case_table_names参数的问题,想了下,如果原来里面有表,表名有大小写的, 如果将lower_case_table_names从默认的0改为1之后,那 ...
- iOS AppsFlyer的使用注意事项
AppFlyer 是近期比較火的一款广告追踪统计工具,当然统计的功能友盟也能够实现,而appsflyer更是具有定向投放,是app跳转到对应的页面. 详细的:当点击广告的时候,假设没有安装应用.则会跳 ...
- 如何在windows上测试iphone?
本教程将会让你没有mac照样测试iphone,这是我折腾了几天总结下来的,希望对大家有用. 先来几张效果图吧 方法很简单,但是配置起来说实话有点麻烦,先在电脑上安装vmware,在安装osx系统,在安 ...