jQuery实现新消息闪烁标题提示的方法
本文实例讲述了jQuery实现新消息闪烁标题提示的方法。分享给大家供大家参考。具体如下:
该代码可实现在标题栏部位闪烁地显示提示信息。
1.jQuery插件风格代码
;(function($){
$.extend({
/**
*调用方法:vartimerArr=$.blinkTitle.show();
*$.blinkTitle.clear(timerArr);
*/
blinkTitle:{
show:function(){//有新消息时在title处闪烁提示
varstep=0,_title=document.title;
vartimer=setInterval(function(){
step++;
if(step==3){step=1};
if(step==1){document.title='【】'+_title};
if(step==2){document.title='【新消息】'+_title};
},500);
return[timer,_title];
},
/**
*@paramtimerArr[0],timer标记
*@paramtimerArr[1],初始的title文本内容
*/
clear:function(timerArr){
//去除闪烁提示,恢复初始title文本
if(timerArr){
clearInterval(timerArr[0]);
document.title=timerArr[1];
};
}
}
});
})(jQuery);
2.调用方法如下:
jQuery(function($){
vartimerArr=$.blinkTitle.show();
setTimeout(function(){//此处是过一定时间后自动消失
$.blinkTitle.clear(timerArr);
},10000);
//若人为操作消失,只需如此调用:$.blinkTitle.clear(timerArr);
});
完整实例代码点击此处本站下载。
希望本文所述对大家的jQuery程序设计有所帮助。