jquery行動端庫有哪些

jquery行動端庫有：1、Mobiscroll，用於觸控螢幕裝置的旋轉滾動、日期和時間選擇；2、“Ion.Sound”，用於即時聲音通知；3、mmenu，用於建立平滑的抽屜式導航選單；4、Naver，用於建立響應式導航；5、gShake等等。

本教學操作環境：windows7系統、jquery1.10.2版本、Dell G3電腦。

行動互聯網的發展，來自PC端的網頁並不能完全自適應行動端頁面需求，使得響應式設計體驗產生並成為潮流，也正是這樣一種需求，促成了jQuery Mobile的流行。 jQuery Mobile這樣一款基於jQuery和jQuery UI的框架，繼承了jQuery的「write less,do more」精髓，具有良好的擴展性和可自訂性，全面兼容各種平台設備，對於不支援的手機類型，也會予以基礎樣式。

本文細數了15款非常優秀又實用的jQuery Mobile插件（庫），類型甚廣，從日期/時間選擇、即時聲音通知、抽屜式導航選單、iOS style、手風琴導航、隱藏/顯示密碼、燈箱特效，到相當酷炫的互動式地圖、頁面震動、Native、相簿/畫廊展示等，總有那麼一款會讓你著迷。

1、Mobiscroll

https://mobiscroll.com/

對於許多開發者而言，Mobiscroll並不陌生，甚至可以說是相當熟悉。 Mobiscroll是一款很不錯的jQuery Mobile插件，主要用於觸控螢幕裝置的旋轉滾動/日期和時間選擇。透過它，用戶只需滑動數字即可進行日期和時間選擇（點擊連結查看Demo）。

Mobiscroll不僅支援任意自訂值，讓使用者完全自訂主題，還可用於下拉清單本機選擇控制。此外，使用起來也是非常方便，不僅為開發者提供了相當高大上的配色方案，而且可完全透過CSS檔案進行樣式修改。支援包括iOS、Android、WP8、Windows 8、BlackBerry等在內的所有主流行動及桌面瀏覽器。

2、Ion.Sound

http://ionden.com/a/plugins/ion.sound/en.html

今天時今日，無論是Web還是行動網站，都充斥著各種各樣的事件，例如新郵件、新聊天資訊、內容更新等。但卻常常存在著這樣一個問題，就是即時通知無法立即引起用戶注意。而透過Ion.Sound插件，則可以很好地實現這項任務。

Ion.Sound是一款用於播放事件聲音的jQuery插件，採用MIT許可證，包含25種免費聲音。截至目前，Ion.Sound已成功運用於Google Chrome、Mozilla Firefox、Opera、Safari、IE(9.0 )等桌面瀏覽器，並支援所有主流行動瀏覽器。

3、jQuery.mmenu

http://mmenu.frebsite.nl/

jQuery.mmenu是一款用於建立平滑的抽屜式導航選單的jQuery插件，只需短短一行JavaScript程式碼，即可在行動網站中實現類似於行動App外觀的非常酷炫的滑動選單。

透過jQuery.mmenu，開發者可以將無序列表轉換成選單項，並進行自訂設定。 jQuery.mmenu不僅為開發者提供了諸如開啟、關閉、切換等常用選單的定制，還提供了選單位置（居左/居右）、是否顯示選單項目計數器等選項的設定。

4、Naver

http://www.benplum.com/formstone/naver/

Naver是一款專門用於建立回應式導航的jQuery插件。透過它，開發者可以輕易地製作出對行動裝置非常友善的導航效果，還可製作動態導航。 Naver相容於Firefox、Chrome、Safari、IE(7 )，基於MIT授權發布，無論是個人或商業項目中，均可自由免費使用。

5、iosOverlay.js

http://taitems.github.io/iOS-Overlay/

iosOverlay.js是一款用於創建iOS風格的提示/通知效果的jQuery插件，支援IE7 、Google Chrome、Firefox、Opera、Safari（桌面版及行動版）。需要提醒的是，如果想要防止圖示在載入時閃爍，開發者需要預先載入影像資源。

此外，iosOverlay.js還存在兩個可選的依賴項，即Spin.js和jQuery。如果開發者想要使用其下拉列表對象，就必須要用到Spin.js，而對於不相容CSS動畫的瀏覽器，則需jQuery提供支援。

6、Easy Responsive Tabs

https://github.com/samsono/Easy-Responsive-Tabs-to-Accordion

Easy Responsive Tabs是一款輕量級的響應式Tab選項卡/手風琴導航jQuery插件，支援同一頁面使用多個範例，跨平台支援Web、平板電腦及行動裝置。該外掛能夠自適應螢幕大小，預設樣式為水平/垂直Tab選項卡，隨著視窗變小，會自動切換為手風琴樣式。

7、Hide/Show Password

https://github.com/cloudfour/hideShowPassword

#

Hide/show Password外掛程式可以讓你輕易隱藏和顯示密碼輸入框中的內容。該插件最酷的地方就是“innerToggle”選項。當設定為開啟時，開發者可以自訂建立非常漂亮的隱藏/顯示控制項。而且在觸控螢幕瀏覽器中進行滑動時還可保持輸入焦點。

8、Swipebox

http://brutaldesign.github.io/swipebox/

Swipebox是一款精美的jQuery燈箱特效插件，可用於桌面、行動和平板裝置。在行動裝置上，支援滑動手勢導航，而在桌面上則可使用鍵盤導航。不支援CSS3過渡特性的瀏覽器可使用jQuery降級處理，支援視網膜顯示，能夠透過CSS輕鬆自訂。

當用戶點擊目標圖片時，照片將會以全尺寸的方式展示，此外，用戶還可對同組的圖片進行左右切換來進行查看，非常適合用於做照片畫廊以及查看大尺寸圖片。

9、App Folder

http://app-folders.com/

如果你是iOS狂熱分子，那麼對於iOS風格的資料夾一定非常熟悉。 「點擊資料夾，透過加深透明度將周圍的元素虛化，然後顯示資料夾中的內容。」App Folders正是這樣一款能夠實現iOS資料夾效果的jQuery插件。該插件可同時在桌面及行動瀏覽器上運作，適配性非常好。

App Folders的資料夾元素可包含任何HTML元素，例如圖片、文字、影片等，且每個資料夾都有專屬於自己的URL實作直接點擊。當然，開發者也無需拘泥於和iOS資料夾一樣的效果，透過App Folders，開發者可以自訂出更富有創意的佈局和特效。

10、jQuery Flip

http://amegan.github.io/jquery-flip/

jQuery Flip是一款能夠讓任意HTML、文字或jQuery元素產生非常漂亮的類似Flipboard的翻轉效果的jQuery插件，基於MIT許可發布。使用CSS 3D轉換，翻轉速度也可進行設置，完全支援Chrome、Safari等WebKit瀏覽器以及Firefox 11。

11、jQuery UI Map

https://code.google.com/p/jquery-ui-map/

對於地圖應用開發者而言，jQuery UI Map絕對是開發的必備利器。這樣一款輕量級jQuery插件，不同於Google Map API，透過jQuery UI Map，開發者不僅能在針對諸如點擊等簡單事件時使用Google事件監聽器，而且還可在地圖和標記上使用jQuery點擊事件。

jQuery UI Map不僅非常靈活，而且高度可自訂。要在地圖上顯示規劃事件，jQuery UI Map會整合Google地圖，讓開發者輕鬆建立互動式地圖。 jQuery UI Map最大的特點就是，當客戶端不支援JavaScript時，開發者可以在備用網站上使用微格式、RDFa或微資料等HTML資料格式實現同步。

12、gShake

https://github.com/GerManson/gShake

gShake是一款能夠實現震動效果的jQuery插件，只需短短幾行程式碼，即可讓導航、圖片，甚至是頁面本身抖動起來，從而讓頁面富有動感、樂趣，支援iOS 4.2 。

13、jQTouch

http://jqtjs.com/

比較本文所介紹的許多可用於行動開發的jQuery插件， jQTouch顯然要更有知名度。透過jQTouch，開發者僅使用HTML、CSS以及jQuery即可創建出非常強大的行動App，更牛叉的是，開發者只需使用核心CSS文件，即可建立一個完全自訂的UI。

jQTouch可以在行動裝置的WebKit瀏覽器上實現諸如動畫、清單導航、預設樣式等常見UI效果，但若要實現更多原生效果，則需額外新增CSS檔案。對於iOS開發者，這點則無需顧慮，因為jQTouch為iOS開發提供了相當豐富的原生效果CSS檔案。

14、PhotoSwipe

http://www.photoswipe.com/

PhotoSwipe是一個開源且免費的專為行動觸控裝置設計的相簿/畫廊展示包，相容於iOS、Android、Blackberry等主流平台及桌面瀏覽器。其底層實作基於HTML、CSS及JavaScript，不依賴任何框架，非常適合想要讓行動網站的相簿體驗和原生App一樣的設計師和開發者。

PhotoSwipe是一個獨立的JavaScript庫，很容易整合到行動網站中，並對行動瀏覽器進行了大量的最佳化。此外，在原始碼中，PhotoSwipe也提供了對桌面瀏覽器及使用jQuery Mobile的支援。

15、Touch Gallery

http://neteye.github.io/touch-gallery.html

和PhotoSwipe一樣，Touch Gallery也是圖片展示插件，透過它，開發者可以在行動瀏覽器上實現類似於原生相簿應用程式的圖像展示效果。支援手勢瀏覽操作，也可運用於桌面版Safari、Firefox、Opera及Chrome等桌面瀏覽器，但某些功能項目無法實現。

【推薦學習：jQuery影片教學、web前端影片】

以上是jquery行動端庫有哪些的詳細內容。更多資訊請關注PHP中文網其他相關文章！