新消息闪烁标题提示Javascript代码

 代码如下 复制代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>新消息闪烁提示Demo</title>
</head>

<body>
 <p style="text-align:center;">请看网页标题处效果!
     <br/>隔10秒后提示消失
    </p>
 <script type="text/javascript" src="../js/jquery-1.4.2.min.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);
  
 jQuery(function($) {
  var timerArr = $.blinkTitle.show();
  
  setTimeout(function() {  //此处是过一定时间后自动消失
   $.blinkTitle.clear(timerArr);
  }, 10000);
  
  //若认为操作消失,只需如此调用: $.blinkTitle.clear(timerArr);
 });
 </script>
</body>
</html>

时间: 2025-01-14 03:00:13

新消息闪烁标题提示Javascript代码的相关文章

jQuery实现新消息闪烁标题提示的方法_jquery

本文实例讲述了jQuery实现新消息闪烁标题提示的方法.分享给大家供大家参考.具体如下: 该代码可实现在标题栏部位闪烁地显示提示信息. 1. jQuery插件风格代码 ;(function($) { $.extend({ /** * 调用方法: var timerArr = $.blinkTitle.show(); * $.blinkTitle.clear(timerArr); */ blinkTitle : { show : function() { //有新消息时在title处闪烁提示 va

js实现的标题栏新消息闪烁提示效果_javascript技巧

公司的项目中用到了这个新消息提示的效果,主要用于提示用户有新消息.具体实现代码如下: 复制代码 代码如下: var newMessageRemind = {    _step: 0,    _title: document.title,    _timer: null,    //显示新消息提示    show: function() {        var temps = newMessageRemind._title.replace("[ ]", "").re

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

可能有一些站长会注意到这样的效果,就是我们在一些SNS社交.社区论坛浏览时,经常会看到收到的新消息会闪烁标题提示,那么这样的效果我们能不能运用在自己的网站呢,新消息在网页标题闪烁显示的效果如何实现?小编有幸在某牛人技术博客看到这样的代码,基于jquery框架. 为解决一些网页特效运行后不能显示效果(例如:jQuery则需要刷新)问题,特别新增网页版演示. 复制代码 代码如下: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional

jQuery实现新消息在网页标题闪烁提示

         这篇文章主要介绍了jQuery实现新消息在网页标题闪烁提示的相关资料,需要的朋友可以参考下              可能有一些站长会注意到这样的效果,就是我们在一些SNS社交.社区论坛浏览时,经常会看到收到的新消息会闪烁标题提示,那么这样的效果我们能不能运用在 自己的网站呢,新消息在网页标题闪烁显示的效果如何实现?小编有幸在某牛人技术博客看到这样的代码,基于jquery框架. ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19

jQuery实现新消息在网页标题闪烁提示_jquery

可能有一些站长会注意到这样的效果,就是我们在一些SNS社交.社区论坛浏览时,经常会看到收到的新消息会闪烁标题提示,那么这样的效果我们能不能运用在 自己的网站呢,新消息在网页标题闪烁显示的效果如何实现?小编有幸在某牛人技术博客看到这样的代码,基于jquery框架. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <base href=&qu

JS实现超简洁网页title标题跑动闪烁提示效果代码_javascript技巧

本文实例讲述了JS实现超简洁网页title标题跑动闪烁提示效果代码.分享给大家供大家参考,具体如下: 这里演示不几行JS代码实现的网页Title文字跑动效果,类似有消息时的标题闪烁提醒功能,在JS代码中,当变量_record累加到3是,将其赋值为1.相当于无限循环.需要显示的消息提示内容可自拟哦. 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/js-title-blink-style-codes/ 具体代码如下: <html xmlns="

在标题栏显示新消息提示,很多公司项目中用到这个方法_javascript技巧

复制代码 代码如下: <a href="#" onclick="clearNewMessageRemind();return false;">点击取消闪烁提示</a> <script type="text/javascript"> var newMessageRemind={ _step: 0, _title: document.title, _timer: null, //显示新消息提示 show:funct

Asp.net C# 如何出现你有几条新消息的提示框

问题描述 库存管理系统当要进行采购时需要审批,审批者登录后会弹出消息提示框,如果有未审批的申请,则点击后登录到对应的页面可以提供详细代码嘛谢各位大神!!! 解决方案 解决方案二:数据库里加一个未审批字段标记一下,登录时候判断有没有未审批的.有几个你看看这个思路解决方案三:按你标题,你应该是要SingleR,而按你内容,貌似你只是登陆时需要,那就是简单的js效果解决方案四:如果你想省事,js里写几行轮询的程序,去拉"有没新消息"这个数据如果你想做有点技术含量并且更合理的,看看signal

js实现网页标题栏闪烁提示效果代码

公司的项目中用到了这个新消息提示的效果,主要用于提示用户有新消息.具体实现代码如下:    代码如下 复制代码 var newMessageRemind={ _step: 0, _title: document.title, _timer: null, //显示新消息提示 show:function(){ var temps = newMessageRemind._title.replace("[ ]", "").replace("[新消息]",