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 监听浏览器最小化的更多相关文章

  1. document.visibilityState 监听浏览器

    document.hidden:表示页面是否隐藏的布尔值.页面隐藏包括 页面在后台标签页中 或者 浏览器最小化 (注意,页面被其他软件遮盖并不算隐藏,比如打开的 sublime 遮住了浏览器). do ...

  2. js监听浏览器tab窗口切换

    js监听浏览器tab窗口切换 ——IT唐伯虎 摘要:js监听浏览器tab窗口切换. if (document.hidden !== undefined) {  document.addEventLis ...

  3. 监听浏览器tab切换

    监听浏览器切屏 为了完成验证用户在切换浏览器tab时进行登录再次认证需求需要监听浏览器切换窗口 if (document.hidden !== undefined) { document.addEve ...

  4. 【hugo】- hugo 监听浏览器切换title

    hugo 博客 监听浏览器title 动态改变浏览器title标题 找到head.html themes/maupassant/layouts/partials/head.html 添加监听js 可以 ...

  5. JS实时监听浏览器宽度的变化

    boot:function(){ //加载页面时执行一次 changeMargin(); //监听浏览器宽度的改变 window.onresize = function(){ changeMargin ...

  6. vue监听浏览器窗口大小变化

    首先,页面初始化mounted的时候,通过 document.body.clientWidth 和 document.body.clientHeight 来获取到浏览器的宽和高,然后通过 window ...

  7. vue JS实现监听浏览器返回按键事件

    // 这个是监听浏览器回退键的returnButton () { let vm = this; $(document).ready(function () { if (window.history & ...

  8. JS监听浏览器标签页的显示与隐藏

    /** * 监听浏览器标签页的显示与隐藏 */ class ListenerPageVisibility { constructor () { // 设置隐藏属性和改变可见属性的事件的名称 this. ...

  9. JS 监听浏览器各个标签间的切换

    以前看到过一些网页,在标签切换到其它地址时,网页上的标题上会发生变化,一直不知道这个是怎么做的,最近查了一些资料才发现有一个 visibilitychange 事件就可以搞定,这里将介绍一下页面可见性 ...

随机推荐

  1. Ansible 之Playbook

    ansbile playbook是一系列ansible命令的集合,利用yaml 语言编写,playbook命令根据自上而下的顺序依次执行.同时,playbook开创了很多特性,它可以允许你传输某个命令 ...

  2. php 统计fasta 序列长度和GC含量

    最近php7的消息铺天盖地, 忍不住想尝试下.星期天看了下语法, 写个小脚本练下手: 这个脚本读取fasta 文件, 输出序列的长度和GC含量: <?php $fasta = "tes ...

  3. C# 线程池执行操作例子

    public partial class Form1 : Form { CountdownEvent hander = ); public static object lock_action = ne ...

  4. C#网络编程之Http请求

    本片篇分享简单介绍C#中的Http请求,前几天帮朋友的项目封装ApiHelper,我粗糙的结果就如下,想想我真的是差的太远了.还有一位架构师也在封装这个Helper , 所以最后的结果当然是使用大牛的 ...

  5. 如何解析本地和线上XML文件获取相应的内容

    一.使用Dom解析本地XML 1.本地XML文件为:test.xml <?xml version="1.0" encoding="UTF-8"?> ...

  6. 两台linux服务器之间实现挂载

    https://blog.csdn.net/lpp_dd/article/details/78743862 两台linux服务器之间实现挂载: 服务端: 1.首先需要在主机上设置允许挂载的目录 (1) ...

  7. spark LinearRegression 预测缺失字段的值

    最近在做金融科技建模的时候,字段里面很多缺少值得时候,模型对于新用户的预测会出现很大的不稳定,即PSI较大的情况. 虽然我们依据字段IV值得大小不断的在调整字段且开发新变量,但是很多IV值很大的字段直 ...

  8. eclipse中去掉validate的方法

    昨天在右击项目想选择refresh的时候一不小心选择了validate,就发现target包出现了红色的叉号.当时觉得反正项目运行没有什么异常,就这么凑合了一天半多. 后来,当我改jsp的时候从< ...

  9. ML基础 : 训练集,验证集,测试集关系及划分 Relation and Devision among training set, validation set and testing set

    首先三个概念存在于 有监督学习的范畴 Training set: A set of examples used for learning, which is to fit the parameters ...

  10. Java如何取得当前程序部署的服务器的IP

    1.问题:之前使用InetAddress.getLocalHost().getHostAddress()时,在开发机测试可以得到192.168.0.18这样的IP.但部署到linux服务器以后, 这个 ...