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

本文纯粹是贴出一些比较实用的代码出来供大家学习和使用,也算是个人博客对这些实用代码的记录和收集吧!有用到的可以参考,没用到的直接可以飘过!

特意将这些代码写成jQuery插件的格式,这样方便大家使用的时候调用。我在平时的开发和自我学习过程中也积累了不少有用的代码,不知道怎么概括性地发布出来,所以就已文章的形式陆续贴出来与大家分享。

以单篇文章发布的插件代码都是一些简单的代码,若是一些复杂的代码或插件我会归纳到插件专区里去,这样大家下载起来也方便!

一、插件代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
;(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);

注意其中调用方法中的timerArr变量,若你在前面调用代码显示了效果,在页面的后面代码中需要清楚该闪烁效果的话,需要注意timerArr变量的作用域。若只是出现效果而无需清楚,则可以直接调用$.hiro.blinkNews.show()

二、调用方法

1
2
3
4
5
6
7
8
9
jQuery(function($) {
	var timerArr = $.blinkTitle.show();

	setTimeout(function() {		//此处是过一定时间后自动消失
		$.blinkTitle.clear(timerArr);
	}, 10000);

	//若人为操作消失,只需如此调用:	$.blinkTitle.clear(timerArr);
  • jQuery:揭露jQuery的隐藏功能
    jQuery并不像他表面显示的那样,只有那些额定的方法供我们使用。其他在他库的代码内有着很多很酷很便捷的潜在方法,等待被我们发现。在本文中,我将带领你去领略一些我在jQuery库中发现的那些不怎么常见的方法。 1.理解jQuery方法: 当你调用jQuery方法时会发生什么呢?看看jQuery的方法体,非常地简单。 1 2 3 4 jQuery = fun...
  • Expand The Water Pump’s Life Expectancy with PUB Approved Gaskets
    When it comes to your water supply, you can not take way too many opportunities. You would like to know that the water entering into your house is risk-free for drinking which all components of you wa...
  • Maternity Bottoms Are Affordable & Comfortable
    You can discover maternal trousers at stores or online. When you browse the web you will locate that there are various brands and also designs to choose from. The trick is to do your research and try ...
  • Shipping Companies in Singapore: Finding Reliable Service
    Various shipping firms in Singapore will have various means as well as means of tempting clients into obtaining them get their solutions. Among one of the most vital things you need to search for is t...
  • Support Your Loved Ones With Singapore Affordable Home Care Services
    There are a lot of Singapore affordable home care services available. There are registered nurses that can come in to help you see to it your household is well. When you are at work, there are solutio...

Previous post:

Next post: