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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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