JS实现闪动的title消息提醒效果


Posted in Javascript onJune 20, 2014

有时候我们需要提醒用户,有新的消息,这个可以使用下面的方法实现。

效果就是网页窗口在没有获取焦点并且最小化的时候,网页窗口的标题栏“title”显示的内容为“【 】”,“【新消息】”的闪烁效果。

<script language="JavaScript"> 
setTimeout('flash_title()',2000); //2秒之后调用一次
function flash_title() 
{ 
  //当窗口效果为最小化,或者没焦点状态下才闪动
  if(isMinStatus() || !window.focus)
  {
    newMsgCount();
  }
  else
  {
    document.title='订单管理中心-AOOXING';//窗口没有消息的时候默认的title内容
    window.clearInterval();
  }
} 
//消息提示
var flag=false;
function newMsgCount(){
  if(flag){
    flag=false;
    document.title='【新订单】';
  }else{
    flag=true;
    document.title='【 】';
  }
  window.setTimeout('flash_title(0)',380); 
}
//判断窗口是否最小化
//在Opera中还不能显示
var isMin = false;
function isMinStatus() {
  //除了Internet Explorer浏览器,其他主流浏览器均支持Window outerHeight 和outerWidth 属性
  if(window.outerWidth != undefined && window.outerHeight != undefined){
    isMin = window.outerWidth <= 160 && window.outerHeight <= 27;
  }else{
    isMin = window.outerWidth <= 160 && window.outerHeight <= 27;
  }
  //除了Internet Explorer浏览器,其他主流浏览器均支持Window screenY 和screenX 属性
  if(window.screenY != undefined && window.screenX != undefined ){
    isMin = window.screenY < -30000 && window.screenX < -30000;//FF Chrome       
  }else{
    isMin = window.screenTop < -30000 && window.screenLeft < -30000;//IE
  }
  return isMin;
}
</script>
Javascript 相关文章推荐
一段实现页面上的图片延时加载的js代码
Feb 11 Javascript
解决ExtJS在chrome或火狐中正常显示在ie中不显示的浏览器兼容问题
Jan 11 Javascript
如何实现修改密码时密码框显示保存到cookie的密码
Dec 10 Javascript
简单的jquery左侧导航栏和页面选中效果
Aug 21 Javascript
js实现遮罩层弹出框的方法
Jan 15 Javascript
Underscore.js 1.3.3 中文注释翻译说明
Jun 25 Javascript
jquery实现简单实用的打分程序实例
Jul 23 Javascript
jQuery.deferred对象使用详解
Mar 18 Javascript
js Dom实现换肤效果
Oct 21 Javascript
详解HTML5 使用video标签实现选择摄像头功能
Oct 25 Javascript
vue实现一拉到底的滑动验证
Jul 25 Javascript
原生js+canvas实现贪吃蛇效果
Aug 02 Javascript
jquery操作checked属性以及disabled属性的多种方法
Jun 20 #Javascript
jquery弹窗插件colorbox绑定动态生成元素的方法
Jun 20 #Javascript
JQuery获取与设置HTML元素的内容或文本的实现代码
Jun 20 #Javascript
jquery获取html元素的绝对位置和相对位置的方法
Jun 20 #Javascript
confirm的用法示例用于按钮操作时确定是否执行
Jun 19 #Javascript
javascript 控制input只允许输入的各种指定内容
Jun 19 #Javascript
$(document).ready(function() {})不执行初始化脚本
Jun 19 #Javascript
You might like
PHP随机字符串生成代码(包括大小写字母)
2013/06/24 PHP
PHP中session变量的销毁
2014/02/27 PHP
js 判断 enter 事件
2009/02/12 Javascript
IE iframe的onload方法分析小结
2010/01/07 Javascript
匹配任意字符的正则表达式写法
2010/04/29 Javascript
解决ExtJS在chrome或火狐中正常显示在ie中不显示的浏览器兼容问题
2013/01/11 Javascript
js调试系列 断点与动态调试[基础篇]
2014/06/18 Javascript
使用jQuery jqPlot插件绘制柱状图
2014/12/18 Javascript
js小数运算出现多位小数如何解决
2015/10/08 Javascript
js使用cookie记录用户名的方法
2015/11/26 Javascript
基于zepto.js实现手机相册功能
2017/07/11 Javascript
使用node.js实现微信小程序实时聊天功能
2018/08/13 Javascript
在vue中实现点击选择框阻止弹出层消失的方法
2018/09/15 Javascript
JS字符串常用操作方法实例小结
2019/06/24 Javascript
Vue分页插件的前后端配置与使用
2019/10/09 Javascript
解决vue v-for src 图片路径问题 404
2019/11/12 Javascript
Vue的状态管理vuex使用方法详解
2020/02/05 Javascript
部署vue+Springboot前后端分离项目的步骤实现
2020/05/31 Javascript
Python函数中定义参数的四种方式
2014/11/30 Python
使用Python脚本来控制Windows Azure的简单教程
2015/04/16 Python
Python使用time模块实现指定时间触发器示例
2017/05/18 Python
python使用matplotlib画饼状图
2018/09/25 Python
如何利用python检测图片是否包含二维码
2020/10/15 Python
CSS3中的transform属性进行2D和3D变换的基本用法
2016/05/12 HTML / CSS
HTML5基于flash实现播放RTMP协议视频的示例代码
2020/12/04 HTML / CSS
Crocs波兰官方商店:女鞋、男鞋、童鞋、洞洞鞋
2019/10/08 全球购物
判断单链表中是否存在环
2012/07/16 面试题
入学生会自荐书范文
2014/02/05 职场文书
经营管理策划方案
2014/05/22 职场文书
精神文明建设先进个人事迹材料
2014/12/24 职场文书
公司文体活动总结
2015/05/07 职场文书
无犯罪记录证明样本
2015/06/16 职场文书
苦儿流浪记读书笔记
2015/07/01 职场文书
python通过opencv调用摄像头操作实例分析
2021/06/07 Python
详解java如何集成swagger组件
2021/06/21 Java/Android
MySQL如何解决幻读问题
2021/08/07 MySQL