`

新消息闪烁标题提示代码分享[转]

阅读更多

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

特意将这些代码写成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);
});
分享到:
评论
发表评论

文章已被作者锁定,不允许评论。

相关推荐

    blinkTitle 基于jquery的新消息闪烁标题提示效果代码分享.zip

    在【描述】中,“基于jquery的新消息闪烁标题提示效果代码分享”进一步强调了这个功能是利用jQuery库来创建的。jQuery是一个广泛使用的JavaScript库,简化了DOM操作、事件处理、动画效果以及Ajax交互等任务。这个...

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

    在本例中,我们将探讨如何使用jQuery实现一个新消息闪烁标题提示的功能,这是一个非常实用的用户界面提示机制,特别是在实时通讯应用或者邮件系统中。 首先,我们需要了解jQuery的核心思想是选择器和链式调用。...

    实现闪烁标题栏,Visual Basic6.0程序,VB6.0源代码

    在提供的压缩包文件“VB2010-02-01如何实现闪烁标题栏”中,可能包含了完整的VB6.0源代码示例,展示了如何将上述步骤整合到实际项目中。通过研究和学习这个示例,你可以更好地理解如何在自己的应用程序中实现标题栏...

    VB032-实现闪烁的标题栏 源代码

    标题“VB032-实现闪烁的标题栏 源代码”揭示了这是一个关于使用Visual Basic编程语言实现窗口标题栏闪烁效果的示例项目。在Windows应用程序开发中,标题栏通常用于显示应用程序的名称和提供窗口操作选项,如最小化、...

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

    在本文中,我们将深入探讨如何使用JavaScript来实现标题栏新消息闪烁提示效果,这种效果通常用于吸引用户的注意力,告知他们有未读的新消息。 首先,我们需要创建一个名为`newMessageRemind`的对象,该对象包含了...

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

    总的来说,这个jQuery代码片段提供了一种简洁的方法,让网页标题在接收到新消息时闪烁提示用户。这种交互设计增强了用户体验,让用户不会错过任何重要的通知。在实际开发中,你可以根据需求调整闪烁频率、消息提示...

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

    为了提高用户体验,当用户接收到新消息时,网页标题出现闪烁效果,能够引起用户的注意,提示他们查看新的消息内容。本文将介绍使用jQuery技术实现网页标题闪烁提示新消息的实现方法。 要实现这一效果,首先需要了解...

    JS 实现浏览器的 title 闪烁、滚动、声音提示、通知,没有依赖

    JS 实现浏览器的 title 闪烁、滚动、声音提示、通知,没有依赖JS 实现浏览器的 title 闪烁、滚动、声音提示、通知,没有依赖JS 实现浏览器的 title 闪烁、滚动、声音提示、通知,没有依赖JS 实现浏览器的 title 闪烁...

    类似QQ收到消息的闪烁窗体

    在IT行业中,窗体闪烁是一种常见的用户提示技术,特别是在即时通讯软件中,如QQ,当有新消息到来时,程序窗口会通过闪烁吸引用户的注意力。本文将深入探讨如何使用C#编程语言实现类似QQ收到消息时的闪烁窗体效果。 ...

    JS实现title标题闪烁提示信息.zip

    下面是一个简单的JS实现闪烁标题提示信息的步骤: 1. **选择元素**:首先,我们需要在HTML中创建一个元素,用于展示闪烁的提示信息。例如,我们可以创建一个`<div>`元素,并设置其`id`以便在JS中引用: ```html 这...

    JS 实现浏览器的 title 闪烁、滚动、声音提示、通知,没有依赖. 它不会干扰任何 JavaScript 库或框架

    总之,JavaScript提供了强大的功能来提升用户体验,包括页面标题的闪烁、滚动、声音提示和桌面通知。通过理解并运用这些技术,开发者可以创建更加生动和引人入胜的Web应用。在实际开发中,可以根据项目需求和用户...

    delphi窗体的标题栏闪烁

    - 如果闪烁是为了提示错误,最好配合其他UI元素(如消息框、图标变更)一起使用,以提高用户体验。 - 需要注意的是,API函数的使用需要考虑兼容性问题,对于不同版本的Windows可能需要不同的处理方式。 通过以上...

    精彩编程与编程技巧-闪烁的标题栏...

    在计算机编程领域,实现窗口或应用程序标题栏的闪烁效果是一种常见的视觉提示技术,主要用于吸引用户的注意力,例如用于提醒用户有未读消息或者正在进行重要的后台处理任务等场景。本文将详细介绍如何利用 `...

    VC+MFC 托盘图标闪烁与消息提示.rar.rar

    在这个"VC+MFC 托盘图标闪烁与消息提示.rar"的压缩包中,我们主要探讨的是如何在MFC应用中实现系统托盘图标的功能,包括图标闪烁和消息提示。 系统托盘图标通常位于任务栏右下角,可以为用户提供一种隐藏但又易于...

    AJAX + JavaScript 实现无页面刷新标题栏提示新信息

    // 调用标题栏闪烁函数,并设置定时器每5秒检查一次新消息 flash_title(); tidck = setTimeout('CheckNews()', 5000); } ``` 4. **初始化页面**:在页面加载完成时自动调用`CheckNews`函数。 ```html ()"> ...

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

    本文实例讲述了JS实现超简洁网页title标题跑动闪烁提示效果代码。分享给大家供大家参考,具体如下: 这里演示不几行JS代码实现的网页Title文字跑动效果,类似有消息时的标题闪烁提醒功能,在JS代码中,当变量_record...

Global site tag (gtag.js) - Google Analytics