| 注册
请输入搜索内容

热门搜索

Java Linux MySQL PHP JavaScript Hibernate jQuery Nginx
oofw5751
10年前发布

闪烁提示的jQuery代码让新消息在网页标题

[JavaScript]代码    

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">   <html>   <head>   <base href="<%=basePath%>">   <title>My JSP 'test.jsp' starting page</title>   </head>   <body>   <p style="text-align: center;">   请看网页标题处效果!   <br />   隔10秒后提示消失   </p>   <script type="text/javascript"   src="script/jquery-2.0.3.js">   </script>   <script type="text/javascript">      (function($) {   $.extend( {   /**   * 调用方法: var timerArr = $.blinkTitle.show();   * $.blinkTitle.clear(timerArr);   */   blinkTitle : {   show : function() { //有新消息时在title处闪烁提示   var step = 0, _title = document.title;   var timer = setInterval(function() {   step++;   if (step == 3) {   step = 1   }      if (step == 1) {   document.title = '【   】' + _title   }      if (step == 2) {   document.title = '【新消息】' + _title   }      }, 500);   return [ timer, _title ];   },   /**   * @param timerArr[0], timer标记   * @param timerArr[1], 初始的title文本内容   */   clear : function(timerArr) { //去除闪烁提示,恢复初始title文本   if (timerArr) {   clearInterval(timerArr[0]);   document.title = timerArr[1];   }      }   }   });   })(jQuery);   // Resources from http://www.ui3g.com   jQuery(function($) {   var timerArr = $.blinkTitle.show();   setTimeout(function() { //此处是过一定时间后自动消失   $.blinkTitle.clear(timerArr);   }, 10000);   //若认为操作消失,只需如此调用: $.blinkTitle.clear(timerArr);   });   </script>   <br />   <center>   如不能显示效果,请按Ctrl+F5刷新本页,更多网页代码:   <a href='http://www.ui3g.com/' target='_blank'>http://www.ui3g.com/</a>   </center>   </body>   </html>