• 网页title标题的闪动效果


    通过网页title来提示用户有新消息这个功能很常见,比如现在的微博,还有一些邮箱,这个功能都很常见。

    1 显示信息数:
    2 <input type="text" id="textMsgs"/>
    3 <button title="开始闪动" onclick="flashTitle('您有' + document.getElementById('textMsgs').value + '条新信息');">开始闪动</button>
    4 <button title="停止闪动" onclick="stopFlash();">停止闪动</button>
     1 var flashTitlePlayer = {
     2         start: function (msg) {
     3             this.title = document.title;
     4             if (!this.action) {
     5                 try {
     6                     this.element = document.getElementsByTagName('title')[0];
     7                     this.element.innerHTML = this.title;
     8                     this.action = function (ttl) {
     9                         this.element.innerHTML = ttl;
    10                     };
    11                 } catch (e) {
    12                     this.action = function (ttl) {
    13                         document.title = ttl;
    14                     }
    15                     delete this.element;
    16                 }
    17                 this.toggleTitle = function () {
    18                     this.action('【' + this.messages[this.index = this.index == 0 ? 1 : 0] + '】来到博客园!');
    19                 };
    20             }
    21             this.messages = [msg];
    22             var n = msg.length;
    23             var s = '';
    24             if (this.element) {
    25                 var num = msg.match(/w/g);
    26                 if (num != null) {
    27                     var n2 = num.length;
    28                     n -= n2;
    29                     while (n2 > 0) {
    30                         s += " ";
    31                         n2--;
    32                     }
    33                 }
    34             }
    35             while (n > 0) {
    36                 s += ' ';
    37                 n--;
    38             };
    39             this.messages.push(s);
    40             this.index = 0;
    41             this.timer = setInterval(function () {
    42                 flashTitlePlayer.toggleTitle();
    43             }, 1000);
    44         },
    45         stop: function () {
    46             if (this.timer) {
    47                 clearInterval(this.timer);
    48                 this.action(this.title);
    49                 delete this.timer;
    50                 delete this.messages;
    51             }
    52         }
    53     };
    54     function flashTitle(msg) {
    55         flashTitlePlayer.start(msg);
    56     }
    57     function stopFlash() {
    58         flashTitlePlayer.stop();
    59     }
  • 相关阅读:
    C++面试题
    kalman滤波原理
    开blog
    Linux图片批处理
    Debian使用相关
    Ubuntu grub引导修复
    Debian系统vim中文显示乱码问题
    Debian配置Apache2支持mod-python和cgi模块
    linux下解压被分割的zip文件
    Ubuntu 16.04 启动错误 "a start job is running for hold until boot process finishes up"
  • 原文地址:https://www.cnblogs.com/Vipming/p/3835195.html
Copyright © 2020-2023  润新知