第19章-使用-jQuery-Mobile插件

19.1使用插件實(shí)現(xiàn)對(duì)話框效果本節(jié)將向讀者介紹兩款分別用于實(shí)現(xiàn)對(duì)話框和側(cè)邊菜單效果的jQueryMobile插件。其中ActionSheet插件用于在jQueryMobile頁(yè)面中實(shí)現(xiàn)彈出對(duì)放話框效果，并且不需要編寫任何腳本代碼。Mmenu插件用于在jQueryMobile頁(yè)面中實(shí)現(xiàn)常見的側(cè)邊菜單效果。

ActionSheet插件ActionSheet插件無須編寫任何JavaScript代碼，完全通過HTML5新增的屬性進(jìn)行控制。通過引入該插件，可以在頁(yè)面中以優(yōu)雅的動(dòng)畫效果彈出一個(gè)任意的窗口，該窗口中的內(nèi)容可以是任何HTML代碼元素。實(shí)戰(zhàn)練習(xí)——在jQueryMobile頁(yè)面中實(shí)現(xiàn)彈出窗口

最終文件：光盤\最終文件\第19章\19-1-1.html視頻：光盤\視頻\第19章\19-1-1.swf

mmenu插件mmenu插件是一款創(chuàng)建滑動(dòng)導(dǎo)航菜單的jQueryMobile插件，只需要短短幾行JavaScript腳本代碼，就可以在移動(dòng)網(wǎng)站中實(shí)現(xiàn)類似于移動(dòng)APP外觀的非常炫酷的側(cè)邊菜單效果。mmenu插件不僅為開發(fā)者提供了諸如打開、關(guān)閉、切換等常用的菜單功能，還提供了菜單位置（居左和居右）、是否顯示菜單項(xiàng)計(jì)數(shù)器等選項(xiàng)的設(shè)置。實(shí)戰(zhàn)練習(xí)——制作側(cè)邊菜單效果

最終文件：光盤\最終文件\第19章\19-1-2.html視頻：光盤\視頻\第19章\19-1-2.swf

19.2使用插件實(shí)現(xiàn)表單效果表單是jQueryMobile應(yīng)用開發(fā)中非常重要的元素，在本節(jié)中將介紹兩款用于選擇日期和時(shí)間的jQueryMobile插件，分別是DateBox插件和Mobiscroll插件。通過使用插件的方式能夠輕松的開發(fā)出相應(yīng)功能的表單元素。

DateBox插件DateBox插件是專門用于jQueryMobile移動(dòng)應(yīng)用的插件，通過該插件可以在彈出的窗口中簡(jiǎn)單直觀地展示一個(gè)日期與時(shí)間的對(duì)話框，用戶直接單擊其中的某個(gè)日期選項(xiàng)，便可以完成日期選擇的操作。實(shí)戰(zhàn)練習(xí)——實(shí)現(xiàn)日期和時(shí)間選擇窗口

Mobiscroll插件Mobiscroll插件默認(rèn)風(fēng)格是以觸摸屏的方式，通過滾動(dòng)屏幕來選擇日期或時(shí)間的值。當(dāng)然也可以自定義選擇日期或時(shí)間的風(fēng)格，如Android、iOS等。該插件專門針對(duì)移動(dòng)觸摸設(shè)備設(shè)計(jì)的UI效果，廣泛應(yīng)用于眾多的移動(dòng)應(yīng)用項(xiàng)目中。實(shí)戰(zhàn)練習(xí)——滾屏選擇日期和時(shí)間

最終文件：光盤\最終文件\第19章\19-2-2.html視頻：光盤\視頻\第19章\19-2-2.swf最終文件：光盤\最終文件\第19章\19-2-1.html視頻：光盤\視頻\第19章\19-2-1.swf

19.3使用插件實(shí)現(xiàn)圖片瀏覽效果圖片交互效果的好壞直接影響所開發(fā)的jQueryMobile應(yīng)用的用戶體驗(yàn)，本節(jié)將向讀者介紹兩款用于實(shí)現(xiàn)圖片瀏覽效果的jQueryMobiel插件，分別是Camera插件和Swipebox插件。其中Camera插件可以在jQueryMobile頁(yè)面中實(shí)現(xiàn)焦點(diǎn)輪換圖片的效果，Swipebox插件可以實(shí)現(xiàn)單擊縮覽圖預(yù)覽大圖的效果。

Camera插件Camera插件是一個(gè)基于jQuery插件的開源項(xiàng)目，功能是對(duì)所指定的圖片集實(shí)現(xiàn)輪播的效果。在輪播過程中，用戶可以查看每一張圖片的主題信息，手動(dòng)中止輪播過程，通過單擊查看每一張被播放的圖片。此外，輪播的圖片還支持縮略圖單擊預(yù)覽方式，方便用戶以縮略圖的方式瀏覽多張圖片。實(shí)戰(zhàn)練習(xí)——實(shí)現(xiàn)焦點(diǎn)輪換圖片效果

最終文件：光盤\最終文件\第19章\19-3-1.html視頻：光盤\視頻\第19章\19-3-1.swf

Swipebox插件Swipebox是一款精美的jQuery燈箱特效插件，可用于桌面、移動(dòng)和平板設(shè)備。在移動(dòng)設(shè)備上，支持滑動(dòng)手勢(shì)導(dǎo)航，而在桌面上則可以使用鍵盤導(dǎo)航。不支持CSS3.0過渡效果的瀏覽器可以使用jQuery降級(jí)處理。當(dāng)用戶點(diǎn)擊目標(biāo)圖片時(shí)，圖片會(huì)以全尺寸的方式顯示，此外，用戶還可以對(duì)同組中的圖片進(jìn)行左右切換來進(jìn)行查看，非常適合做照片畫廊以及查看大尺寸圖處。實(shí)戰(zhàn)練習(xí)——實(shí)現(xiàn)單擊查看大圖效果

最終文件：光盤\最終文件\第19章\19-3-2.html視頻：光盤\視頻\第19章\19-3-2.swf

19.4本章小結(jié)本章分類介紹了6款專門針對(duì)jQueryMobile移動(dòng)應(yīng)用開發(fā)的插件，通過相應(yīng)的實(shí)例制作，詳細(xì)