网页title标题的闪动效果
通过网页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标题的闪动效果的更多相关文章
- 如何动态修改网页的标题(title)?
有时候我们需要复用一个页面,但是又希望他们拥有各自的标题,这时候就需要动态的去更改页面的title了,不然所有页面都是一个标题. 这时候就会想到使用js或jQuery去实现了. 1.js方式. 首先, ...
- 前端 HTML 常用标签 head标签相关内容 title标签 网页的标题信息
title标签 <title>标签:在<title>和</title>标签之间的文字内容是网页的标题信息,它会显示在浏览器标签页的标题栏中. 可以把它看成是一个网页 ...
- 怎样查看或修改网页的标题title
网页的标题一般指的是 <title>标签之间的文本节点值, 它会显示在浏览器的标签页上, 我们可以通过 document.title 来查看或修改它: document.title; // ...
- JS中的document.title可以获取当前网页的标题
<!DOCTYPE html> <html> <head> <title>jb51.net</title> </head> &l ...
- 网页样式——各种炫酷效果持续更新ing...
1.evanyou效果-彩带的实现,效果如下 注:这个主要用的是Canvas画布实现的,点击背景绘制新的图形,代码如下: /*Html代码:*/ <canvas id=">< ...
- SEO 网站页面SEO优化之页面title标题优化
在seo优化中,标题的优化占着举足轻重的地位,无论是从用户体验的角度出发,还是从搜索引擎的排名效果出发,title标题都是页面优化最最重要的因素.笔者总结了优化title标题应该注意的六个方面: ①. ...
- 网页title左边显示网页的logo图标
打开某一个网页会在浏览器的标签栏处显示该网页的标题和图标,当网页被添加到收藏夹或者书签中时也会出现网页的图标,怎么在网页title左边显示网页的logo图标呢? 方法1: 找一个或者作一个ico文件, ...
- [转]让你的网页文本框增加光晕效果与提示,水印(类似QQ2011)
本文转自:http://www.cnblogs.com/xiaofengfeng/archive/2013/01/28/2880344.html 让你的网页文本框增加光晕效果(类似QQ2011) 我们 ...
- ECSHOP筛选属性修改title标题
发现百度蜘蛛爬行网站时会爬行属性链接,而且会进行收录.可是ecshop系统制作的网站,在分类页点击属性筛选出产品时,网页title不会改变.这样就会造成大量title一样的页面,不利于优化.为此,在网 ...
随机推荐
- 3月19日 html(一) html基础内容
---恢复内容开始--- 今天学习了html的第一节课,是些比较简单的基础知识,知道如何向网页里添加文本.图片.表格.超链接之类的,如何去编写这些代码. html(hyper text makeup ...
- PHP根据概率产生随机数
假设 有四个选项:a 占 10%,b占20% ,C占30% , d 占 40% ,原理就是现获取随机数,然后找区间.当然了,选项的数量可以任意.目前默认是 总和是 100% .如果需要别的数,修改 随 ...
- ios开发之常用宏的定义
有些时候,我们需要将代码简洁化,这样便于读代码.我们可以将一些不变的东东抽取出来,将变化的东西作为参数.定义为宏,这样在写的时候就简单多了. 下面例举了一些常用的宏定义和大家分享: 1. 判断设备的操 ...
- SSH本地端口转发
也是在公司常用的命令,还没有将EXPECT和SPAWN结合好,先用着: 带证书验证远程登陆的. (从公司内网服务器直接跳到外网服务器的内网端口) ssh -C -f -N -g -i private_ ...
- PSAM 卡的应用操作方法
PSAM 卡的应用 PSAM 功能 终端安全存储模块 PASM 常用于 脱机交易的 安全认证 脱机交易的流程 1.卡片对持卡人的认证(防止 ...
- 关闭WIN10的UAC/自动更新/杀毒软件(兼容WIN7/8/8.1)
第一部分:禁用wuauserv服务以及关闭UAC(保存为DW10UD.REG) Windows Registry Editor Version 5.00 [HKEY_LOCAL_MACHINE\SYS ...
- 关于API的设计和需求抽象
一,先来谈抽象吧,因为抽象跟后面的API的设计是息息相关的 有句话说的好(不知道谁说的了):计算机科学中的任何问题都可以抽象出一个中间层就解决了. 抽象是指在思维中对同类事物去除其现象的.次要的方面, ...
- universal image loader在listview/gridview中滚动时重复加载图片的问题及解决方法
在listview/gridview中使用UIL来display每个item的图片,当图片数量较多需要滑动滚动时会出现卡顿,而且加载过的图片再次上翻后依然会重复加载(显示设置好的加载中图片) 最近在使 ...
- move 表索引失效
SQL> select INDEX_NAME,status from user_indexes; INDEX_NAME STATUS ------------------------ ...
- 瑞柏匡丞谈中国移动app的国际进阶路
当今3.0互联时代,已然形成了一个移动化,互动化,全球化的完整体系.瑞柏匡丞也在常年与国内外客户的交流沟通中有了自己的些许见解. 国内的移动产业的发展已然非常迅速,但也正是因为各类企业的不断崛起,能够 ...