jQuery實現(xiàn)新消息閃爍標題提示的方法
更新時間:2015年03月11日 11:57:26 作者:HiroZhang
這篇文章主要介紹了jQuery實現(xiàn)新消息閃爍標題提示的方法,實例分析了jQuery操作樣式的技巧,具有一定參考借鑒價值,需要的朋友可以參考下
本文實例講述了jQuery實現(xiàn)新消息閃爍標題提示的方法。分享給大家供大家參考。具體如下:
該代碼可實現(xiàn)在標題欄部位閃爍地顯示提示信息。
1. jQuery插件風格代碼
;(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);
2. 調用方法如下:
jQuery(function($) { var timerArr = $.blinkTitle.show(); setTimeout(function() {//此處是過一定時間后自動消失 $.blinkTitle.clear(timerArr); }, 10000); //若人為操作消失,只需如此調用:$.blinkTitle.clear(timerArr); });
完整實例代碼點擊此處本站下載。
希望本文所述對大家的jQuery程序設計有所幫助。
相關文章
jQuery hover事件簡單實現(xiàn)同時綁定2個方法
這篇文章主要介紹了jQuery hover事件簡單實現(xiàn)同時綁定2個方法,可實現(xiàn)同時綁定懸停與離開事件的功能,非常簡單實用,需要的朋友可以參考下2016-06-06jQuery實現(xiàn)鼠標雙擊Table單元格變成文本框及輸入內容后更新到數(shù)據(jù)庫的方法
這篇文章主要介紹了jQuery實現(xiàn)鼠標雙擊Table單元格變成文本框及輸入內容后更新到數(shù)據(jù)庫的方法,涉及jQuery響應鼠標事件動態(tài)操作頁面元素及基于get實現(xiàn)ajax交互保存數(shù)據(jù)的相關技巧,需要的朋友可以參考下2015-11-11jQuery實現(xiàn)多張圖片上傳預覽(不經過后端處理)
本篇文章主要介紹了jQuery實現(xiàn)多張圖片上傳預覽(不經過后端處理)的相關知識。具有很好的參考價值。下面跟著小編一起來看下吧2017-04-04jQuery height()、innerHeight()、outerHeight()函數(shù)的區(qū)別詳解
這篇文章主要介紹了jQuery height()、innerHeight()、outerHeight()函數(shù)的區(qū)別詳解,需要的朋友可以參考下2016-05-05