当网页失去焦点时改变网页的title值

<script>
     document.addEventListener(‘visibilitychange‘, function() {
      var isHidden = document.hidden;
      if (isHidden) {
       document.title = ‘改变后的标题‘;
      } else {
       document.title = ‘未改变的标题‘;
      }
     });
</script>

visibilitychange事件是浏览器新添加的一个事件,当浏览器的某个标签页切换到后台,或从后台切换到前台时就会触发该消息,现在主流的浏览器都支持该消息了,例如Chrome, Firefox, IE10等

举个栗子,比如在html5开发的小游戏中,因切换页面或窗口化页面时,需暂停游戏,从而触发 visibilitychange  事件

1.hidden:页面在后台标签页中或者浏览器最小化

2.visible:页面在前台标签页中

3.prerender:页面在屏幕外执行预渲染处理 document.hidden 的值为 true

4.unloaded:页面正在从内存中卸载

时间: 2024-11-10 14:55:56

当网页失去焦点时改变网页的title值的相关文章

input获得焦点时改变placeholder文本的样式

HTML: <input type="text" placeholder="sample text"/> CSS: input::-webkit-input-placeholder { color: #999; } input:focus::-webkit-input-placeholder { color: red; } /* Firefox < 19 */ input:-moz-placeholder { color: #999; } inpu

动态改变 网页的宽度 &lt;--&gt; body的滚动条

1. <body style="min-width:600px;overflow:scroll;" allowfullscreen="true"> </body> 当网页的宽度 缩小到 比 min-width的值小时,<body/>就会出现 水平滚动条. 2. 动态改变 <body/> 的 min-width属性: js代码:document.body.style.minWidth = 数值 + "px&qu

iOS 7.1的Safari为meta标签新增minimal-ui属性,在网页加载时隐藏地址栏与导航栏

iOS 7.1的Safari为meta标签新增minimal-ui属性,在网页加载时隐藏地址栏与导航栏 在过去,用 Safari 打开一个网页后是这样的: 是不是十分不爽?因为顶部的地址栏与底部的导航栏让页面显得非常拥挤,所以用户常常会马上伸手触屏滑动让它们隐藏起来. 始终强调人性化设计的苹果当然注意到了这点,于是在 iOS 7.1 的 Safari 中为 meta 标签新增 minimal-ui 属性,让网页在加载时便可隐藏顶部的地址栏与底部的导航栏. 如何实现?你只需将“minimal-ui

默认主页更改 主页锁定 打开浏览器时的网页设置

修改注册 表 ------------reg 打开浏览器时的网页设置 HKEY_LOCAL_MACHINE\Software\Microsoft\Internet Explorer\Main HKEY_CURRENT_USER\Software\Microsoft\Internet Explorer\Main "Start Page"="http://www.2345.com/?k90007203" 默认主页更改 HKEY_LOCAL_MACHINE\Softwar

用JS让下拉框改变网页背景颜色

<HTML> <HEAD> <TITLE>石家庄渣浆泵配件</TITLE> </HEAD> <SCRIPT> <!-- function bgChange(selObj) { newColor = selObj.options[selObj.selectedIndex].text; document.bgColor = newColor; selObj.selectedIndex = -1; } //--> </SC

webview改变网页宽度

- (void)webViewDidFinishLoad:(UIWebView *)webView { //修改服务器页面的meta的值 NSString *meta = [NSString stringWithFormat:@"document.getElementsByName(\"viewport\")[0].content = \"width=%f, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.

网页失去焦点事件 visibilitychange

当网页失去焦点事件时会触发 visibilitychange 事件,可进行相关逻辑处理 如失去焦点需暂停播放 或 变更title吸引用户回来.. eg: <script> document.addEventListener('visibilitychange', function () { var isHidden = document.hidden; if (isHidden) { //失去焦点 document.title = '小主,快回来'; } else { //未失去焦点 docu

CSS如何实现当鼠标放在图片上时改变边框

CSS如何实现当鼠标放在图片上时改变边框:建议:尽可能的手写代码,可以有效的提高学习效率和深度.很多网页都有这样的效果,当鼠标放在图片链接上的时候,图片的边框会发生变化.下面就简单介绍一下如何实现此种效果.实例代码如下: <!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="http://ww

easyui-tabs图标(获取焦点时显示图标,失去焦点时隐藏图标)

获取焦点时显示图标,失去焦点时隐藏图标 <script type="text/javascript"> $('#_progress').tabs({ onSelect: function (title) { var tab = $('#_progress').tabs('getSelected'); // get selected panel var index = $('#_progress').tabs('getTabIndex', tab); //alert(inde