怎么使用jQuery對話框插件jBox 2.3

這篇文章主要講解了“怎么使用jQuery對話框插件jBox 2.3”，文中的講解內容簡單清晰，易于學習與理解，下面請大家跟著小編的思路慢慢深入，一起來研究和學習“怎么使用jQuery對話框插件jBox 2.3”吧！

插件說明

- jBox 是一款基于 jQuery 的多功能對話框插件，能夠實現網站的整體風格效果，給用戶一個新的視覺享受。

運行環境

- 兼容 IE6+、Firefox、Chrome、Safari、Opera 等主流瀏覽器。

使用授權

- jBox ***免費使用，但是必須保留相關的版權信息。如果有好的建議，可以直接在下面留言。

[2011-11-11] jBox v2.3 正式版

- [調整&修復] IE6下有iframe或頁面有active、applet控件的情況下自動選擇用iframe來遮罩。

- [修復] IE6下拖動窗口到右邊時邊框不可見的樣式錯誤(依然還有20px，但影響不大)。

- [修復] IE6下prompt相關方法與messager方法的圖標最小高度不正確的樣式修正。

- [修復] IE6下messager方法的窗口在滾動條被拖動的時候位置不正確的bug。

- [修復] 修復瀏覽器改變大小時遮罩層不完全的bug。

[2011-11-08] jBox v2.3 beta 版本更新

- [新增] tip方法增加了 opacity 選項，它決定是否顯示隔離層。

- [新增] 增加了 showScrolling 選項，在顯示jBox窗口時可以隱藏瀏覽器的滾動條。

- [新增] 多個窗口共存時，點擊某個窗口標題時，窗口自動處于最頂層。

- [調整] id 選項默認改為null，當為null時會自動生成隨機id，一個id只會顯示一個jBox。

- [調整] loaded 選項增加了個參數h，參數h表示窗口內容的jQuery對象，方便用戶在窗口加載后對內容進行初始化處理。

- [調整] 把全局設置放到獨立的js文件，統一放在目錄 i18n，目前只有jquery.jBox-zh-CN.js。

- [調整] 按空格鍵可直接執行默認按鈕提交的事件(為保留此功能，按鈕為焦點時不是很好看，但用戶體驗應該優先考慮)。

- [修復] 修復在IE下多窗口狀態切換時顯示不了的Bug。

使用方法：

常見使用問題：

1.請使用XHTML 1.0標準，確保html頂部加上下面這行

2.不想顯示標題?

把title設置為null即可，例如： jBox('內容', { title: null });

3.不想要按鈕?自定義按鈕?

把buttons設置為{}表示不顯示按鈕，例如： jBox('內容', { buttons: {} });

自定義按鈕：jBox('內容', { buttons: {'按鈕1':'按鈕1點擊返回值','按鈕2':'按鈕2點擊返回值'} });

還可以設置buttonsFocus要哪個按鈕為默認按鈕，索引從0開始

4.不顯示隔離層?

把opacity設置為0即可，例如： jBox('內容', { opacity: 0 });

5.窗口自動關閉?

把timeout設置為0表示不自動關閉，正數表示多少毫秒后自動關閉，例如3秒后關閉： jBox('內容', { timeout: 3000 });

6.在不顯示隔離層的情況下，想防止點擊按鈕彈出多個一樣的窗口?

把id傳進去就可以了，因為一個id只會顯示一個窗口，例如： jBox('內容', { id: 'my-id'});

7.窗口的高和寬一定要指定值嗎?可以自適應嗎?

除了iframe外，其它情況，是可以指定窗口的高和寬是自適應的，例如：jBox('內容', { width: 'auto', height:'auto' });

jbox的可選參數很多，結合不同的參數可以會有不同的效果，請查看下面的全局參數說明(在文件jquery.jBox-zh-CN.js)。如果你是使用簡體中文，且不想改全局配置，則不需要加載jquery.jBox-zh-CN.js，因為jquery.jBox-2.3.min.js里默認的設置和jquery.jBox-zh-CN.js是一樣的，如果只想修改某幾個選項，例如窗口邊框，只需要一行代碼就可以：jBox.setDefaults({ defaults: { border: 8} });

感謝各位的閱讀，以上就是“怎么使用jQuery對話框插件jBox 2.3”的內容了，經過本文的學習后，相信大家對怎么使用jQuery對話框插件jBox 2.3這一問題有了更深刻的體會，具體使用情況還需要大家實踐驗證。這里是億速云，小編將為大家推送更多相關知識點的文章，歡迎關注！