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

 显示信息数:
<input type="text" id="textMsgs"/>
<button title="开始闪动" onclick="flashTitle('您有' + document.getElementById('textMsgs').value + '条新信息');">开始闪动</button>
<button title="停止闪动" onclick="stopFlash();">停止闪动</button>
 var flashTitlePlayer = {
start: function (msg) {
this.title = document.title;
if (!this.action) {
try {
this.element = document.getElementsByTagName('title')[0];
this.element.innerHTML = this.title;
this.action = function (ttl) {
this.element.innerHTML = ttl;
};
} catch (e) {
this.action = function (ttl) {
document.title = ttl;
}
delete this.element;
}
this.toggleTitle = function () {
this.action('【' + this.messages[this.index = this.index == 0 ? 1 : 0] + '】来到博客园!');
};
}
this.messages = [msg];
var n = msg.length;
var s = '';
if (this.element) {
var num = msg.match(/\w/g);
if (num != null) {
var n2 = num.length;
n -= n2;
while (n2 > 0) {
s += " ";
n2--;
}
}
}
while (n > 0) {
s += ' ';
n--;
};
this.messages.push(s);
this.index = 0;
this.timer = setInterval(function () {
flashTitlePlayer.toggleTitle();
}, 1000);
},
stop: function () {
if (this.timer) {
clearInterval(this.timer);
this.action(this.title);
delete this.timer;
delete this.messages;
}
}
};
function flashTitle(msg) {
flashTitlePlayer.start(msg);
}
function stopFlash() {
flashTitlePlayer.stop();
}

网页title标题的闪动效果的更多相关文章

  1. 如何动态修改网页的标题(title)?

    有时候我们需要复用一个页面,但是又希望他们拥有各自的标题,这时候就需要动态的去更改页面的title了,不然所有页面都是一个标题. 这时候就会想到使用js或jQuery去实现了. 1.js方式. 首先, ...

  2. 前端 HTML 常用标签 head标签相关内容 title标签 网页的标题信息

    title标签 <title>标签:在<title>和</title>标签之间的文字内容是网页的标题信息,它会显示在浏览器标签页的标题栏中. 可以把它看成是一个网页 ...

  3. 怎样查看或修改网页的标题title

    网页的标题一般指的是 <title>标签之间的文本节点值, 它会显示在浏览器的标签页上, 我们可以通过 document.title 来查看或修改它: document.title; // ...

  4. JS中的document.title可以获取当前网页的标题

    <!DOCTYPE html> <html> <head> <title>jb51.net</title> </head> &l ...

  5. 网页样式——各种炫酷效果持续更新ing...

    1.evanyou效果-彩带的实现,效果如下 注:这个主要用的是Canvas画布实现的,点击背景绘制新的图形,代码如下: /*Html代码:*/ <canvas id=">< ...

  6. SEO 网站页面SEO优化之页面title标题优化

    在seo优化中,标题的优化占着举足轻重的地位,无论是从用户体验的角度出发,还是从搜索引擎的排名效果出发,title标题都是页面优化最最重要的因素.笔者总结了优化title标题应该注意的六个方面: ①. ...

  7. 网页title左边显示网页的logo图标

    打开某一个网页会在浏览器的标签栏处显示该网页的标题和图标,当网页被添加到收藏夹或者书签中时也会出现网页的图标,怎么在网页title左边显示网页的logo图标呢? 方法1: 找一个或者作一个ico文件, ...

  8. [转]让你的网页文本框增加光晕效果与提示,水印(类似QQ2011)

    本文转自:http://www.cnblogs.com/xiaofengfeng/archive/2013/01/28/2880344.html 让你的网页文本框增加光晕效果(类似QQ2011) 我们 ...

  9. ECSHOP筛选属性修改title标题

    发现百度蜘蛛爬行网站时会爬行属性链接,而且会进行收录.可是ecshop系统制作的网站,在分类页点击属性筛选出产品时,网页title不会改变.这样就会造成大量title一样的页面,不利于优化.为此,在网 ...

随机推荐

  1. 使用PHP对数据库输入进行恶意代码清除

    这是一个有用的PHP函数清理了所有的输入数据,并删除代码注入的几率. function sanitize_input_data($input_data) { $input_data = trim(ht ...

  2. R语言学习网站

    一个不错的个人R语言博客网站 http://blog.fens.me/r-overview/

  3. JavaWeb学习笔记--4.EL表达式

    四. 表达式语言(相当于对JSP中对象输出的简化,功能实质上类似) 转自ZHSJUN的博客 http://blog.csdn.net/zhsjun/article/details/2254546 表达 ...

  4. .NET知识点总结一(笔记整合)

    1.   .net framework原理简介,C#程序的两次编译 .NET源代码——>语言编译器(第一次编译)——>MSIL+元数据(exe文件)——>CLR(公共语言运行时——类 ...

  5. GoogLeNet学习心得

    转自:http://blog.csdn.net/liumaolincycle/article/details/50471289#t0 综述: http://blog.csdn.net/sunbaigu ...

  6. PCB Layout 中的高频电路布线技巧

    1.多层板布线 高频电路往往集成度较高,布线密度大,采用多层板既是布线所必须,也是降低干扰的有效手段.在PCB Layout阶段,合理的选择一定层数的印制板尺寸,能充分利用中间层来设置屏蔽,更好地实现 ...

  7. Linux下cut命令用法

    1 一两句话描述一下cut命令吧! 正如其名,cut的工作就是“剪”,具体的说就是在文件中负责剪切数据用的. cut是以每一行为一个处理对象的,这种机制和sed是一样的.(关于sed的入门文章将在近期 ...

  8. 基本SQL练习题--选课经典例题

    为管理岗位业务培训信息,建立3个表: S (S#,SN,SD,SA) S#,SN,SD,SA 分别代表学号.学员姓名.所属单位.学员年龄 C (C#,CN ) C#,CN 分别代表课程编号.课程名称 ...

  9. MVC4.0系统开发新手历程(四)数据列表查询

    任何系统都不可避免的就是数据的查询展示,我觉得这里最值得一说的就是分部视图以及数据分页了 首先添加控制器 在控制其上面的名字为Index的Action上面右击,添加视图即可添加对应的视图,分部视图呈现 ...

  10. AIR检测网络

    package com.juyou.util.net { import flash.events.StatusEvent; import flash.net.URLRequest; import ai ...