記得當初 IE 為了避免不明的控制項自動安裝的爭議,因此會在網頁上方顯示一個黃色的說明列來提醒瀏覽者。現在這樣的 Activebar 效果也常被拿來用在...提醒瀏覽者的瀏覽器太舊要去升級更新,例如還在使用 IE 6 的人!(冏)
套件名稱:Activebar
套件版本:2.0.1
作者網站:http://westhoffswelt.de/projects/activebar2.html
套件網址:http://plugins.jquery.com/project/activebar2
發佈日期:2009-02-20
檔案大小:9.21 KB
檔案下載:activebar2.js
參數說明:
檢視原始碼 JavaScript
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 35 | background(選填) 描述: Activebar 的背景顏色;但只要是 css 中所允許的 background 值都可接受 預設值: 'InfoBackground' border(選填) 描述: Activebar 的邊框顏色;只能是顏色值 預設值: '#c8c8c8' highlight(選填) 描述: 當滑鼠移到 Activebar 上時的背景顏色;但只要是 css 中所允許的 background 值都可接受 預設值: 'Highlight' font(選填) 描述: Activebar 內容的文字字型 預設值: 'Bitstream Vera Sans,verdana,sans-serif' fontColor(選填) 描述: Activebar 內容的文字顏色 預設值: 'InfoText' fontSize(選填) 描述: Activebar 內容的文字大小 預設值: '12px' icon(選填) 描述: Activebar 左邊的提示圖示 預設值: 'images/activebar-information.png' button(選填) 描述: Activebar 右邊的關閉 Activebar 圖示 預設值: 'images/activebar-closebtn.png' url(選填) 描述: 當滑鼠點擊 Activebar 時要連至的網址 預設值: null |
方法說明:
檢視原始碼 JavaScript
1 2 | // 把指定的內容轉成 Activebar 效果 $(selector).activebar(options); |
使用範例:
檢視原始碼 JavaScript
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 | <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript" src="activebar2.js"></script> <script type="text/javascript"> $(function(){ // 預設 msg 訊息及 download 位置 var msg = '正直的好青年就是要用符合標準的瀏覽器!<a href="#">進來吧~</a>', download = 'http://abgne.tw/'; // 如果訪問者是用 IE 6 則叫他升級 if($.browser.msie && $.browser.version <= 6){ msg = '什麼?您還在用老古董 IE 6 嗎?趕快升級到 IE 8 吧!<a href="#">快去升級~</a>'; download = 'http://www.microsoft.com/taiwan/windows/internet-explorer/default.aspx'; } // 顯示 Activebar $('<div></div>').html(msg).activebar({ icon: 'images/monkey.png', url: download }); }); </script> |