浏览器title失去焦点时改变title
document.addEventListener('visibilitychange', function() {
var isHidden = document.hidden;
if (isHidden) {
document.title = '当焦点不在当前窗口时的网页标题';
} else {
document.title = '再变回来或者做点其他的';
}
});
document.hidden:表示页面是否隐藏的布尔值。页面隐藏包括 页面在后台标签页中 或者 浏览器最小化 (注意,页面被其他软件遮盖并不算隐藏,比如打开的 sublime 遮住了浏览器)。
document.visibilityState:表示下面 4 个可能状态的值
hidden:页面在后台标签页中或者浏览器最小化
visible:页面在前台标签页中
prerender:页面在屏幕外执行预渲染处理 document.hidden 的值为 true
unloaded:页面正在从内存中卸载
Visibilitychange事件:当文档从可见变为不可见或者从不可见变为可见时,会触发该事件。
这样,我们可以监听 Visibilitychange 事件,当该事件触发时,获取 document.hidden 的值,根据该值进行页面一些事件的处理。
浏览器title失去焦点时改变title的更多相关文章
- C#TreeView节点选中后失去焦点时改变节点背景色
C#TreeView节点选中后失去焦点时改变节点背景色 在使用TreeView控件时候,单击一个节点,当鼠标聚焦到别的地方的时候,之前点击的这个节点就看不清楚了 举例截图 单击后 ...
- 关于饿了么在浏览器标签页失去焦点时网页Title改变的实现方法
说在前面:必须是基于支持H5的浏览器才可以 这个 API 本身非常简单,由以下三部分组成. document.hidden:表示页面是否隐藏的布尔值.页面隐藏包括 页面在后台标签页中 或者 浏览器最小 ...
- Winform禁止容器内控件获得焦点时改变容器显示范围坐标
在Winform中当容器的可视高度无法显示所有控件并且容器的AutoScroll属性设置为True的情况下,但点击容器内某个未显示完整的控件时,会出现容器的滚动条自动下滚的情况. 这是由于控件获得焦点 ...
- 当网页失去焦点时改变网页的title值
<script> document.addEventListener('visibilitychange', function() { var isHidden = document.hi ...
- input获得焦点时改变placeholder文本的样式
HTML: <input type="text" placeholder="sample text"/> CSS: input::-webkit-i ...
- JavaScript监听页面可见性(焦点)同时改变title的三种方法
JavaScript监听页面可见性(焦点)同时改变title的三种方法 本文参考了https://developer.mozilla.org/zh-CN/docs/Web/API/Page_Visib ...
- 钉钉内置的浏览器怎么改变title
在我项目的开发过程当中,遇到过在钉钉打开的vue写的h5页面,通过在路由切换的时候通过全局的路由钩子函数改变 document.title 的内容失效的问题. const routes = [ { p ...
- 去掉chrome浏览器中input获得焦点时的带颜色边框呢
可以设置表单控件的outline属性为none值, 来去掉Chrome浏览器中输入框以及其它表单控件获得焦点时的带颜色边框. css代码如下: input{outline:none}
- vue router 修改title(IOS 下动态改变title失效)
在ios下app 设置document.title = "titleName" 失效,原因是在IOS webview中网页标题只加载一次,动态改变是无效的. 在路由配置中添加 ...
随机推荐
- 架构:MVVC
ylbtech-架构:MVVC MVVM是Model-View-ViewModel的简写.它本质上就是MVC 的改进版.MVVM 就是将其中的View 的状态和行为抽象化,让我们将视图 UI 和业务逻 ...
- day4装饰器-迭代器&&生成器
一.装饰器 定义:本质是函数,(装饰其他函数)就是为其它函数添加附加功能 原则:1.不能修改被装饰的函数的源代码 2.不能修改被装饰的函数的调用方式 实现装饰器知识储备: 1.函数及“变量” 2.高阶 ...
- HDU - 2828 网络流
题目大意 有n个灯,m个开关,由于线路乱接导致可能有多个开关对应一个灯(并联),有的灯在开关开的时候亮 有的灯在开关关的时候亮,[每个开关最多对应两盏灯],试找出一种开关的ON,OFF状态,使得所有灯 ...
- IT兄弟连 Java Web教程 Tomcat
本文采用的Tomcat服务器版本是Tomcat8.5版本,Tomcat8.5支持Servlet3.1.JSP2.3以及EL3.0规范.并且Tomcat8.5版本对JDK8的支持比Tomcat8更加全面 ...
- 关于AFNetWorking 2.5.4之后版本编译报错问题解决方案
最近升级了AFN框架到2.6版本然后编译却出错了 错误如下: 错误出现在 AFSecurityPolicy.h 这个类中 解决办法如下: 在项目的.pch文件里添加 #ifndef TARGET_OS ...
- OpenCV认识之发展历史
OpenCV认识之发展历史刚接触OpenCV,据说是专门用于机器视觉,机器人图形图像处理等,但对OpenCV的历史还不是特别了解,今天上网查好多资料,记录在此,OpenCV的全称是:Open Sour ...
- VS2017专业版使用最新版Qt5.9.2教程(最新教材)
QT配置 Creator ================================================================= 之前运行release版本或者de ...
- 关于itchat用法的一篇博文
itchat的原理就是利用爬虫爬取了网页版微信的内容,并进行一系列的操作,运用微信,通过手机与电脑时登录的互通性,可以实现用微信对电脑的操作,通过itchat.msg_register方法,可以得到目 ...
- 500 Keyboard Row 键盘行
给定一个单词列表,只返回可以使用在键盘同一行的字母打印出来的单词. 详见:https://leetcode.com/problems/keyboard-row/description/ C++: cl ...
- mysql replication错误常见处理
大部分的错误,都是日志错误 日志本身的错误 主日志和中继日志都可能出错,可以使用mysqlbinlog来读一下mysqlbinlog mysql-bin.000007>/dev/null ##只 ...