應用于網站導航中的 15 個 jQuery 插件

jopen 11年前發布 | 9K 次閱讀 jQuery

當考慮到網頁設計時,導航被認為是使網頁以用戶友好方式展現的一個重要部分。在現代的交互網站中,導航起著至關重要的作用,如果沒有正確地處理會影響你網站的訪問。適當的導航工具能夠幫助用戶在網站的不同頁面內容間進行交互并執行動作。這在電子商務網站及注冊網站等案例中是非常重要的。

請務必記住——設計網站時簡約實現的簡潔、優雅、干凈的設計總能贏得用戶的心。調查還指出,現代網絡用戶沒有那么多耐心,它們不會在混亂的網站中苦苦尋找而是直接選擇切換到另一個站點。這就是為什么開發者需要非常注意采用適當的導航類型。

在網站中實現導航欄的時候,使用jQuery導航插件是十分簡單和快速的一個方式 。插件各式各樣,在文章中我們將進一步討論15種當前最流行的效果最好的 jQuery 導航欄插件。

推薦文章: HTML5-10個最重要的特點和優勢

1. Smint – 一個將節點轉化為導航欄的標簽的有效插件。在網站單頁中 Smint 能使網頁平滑滾動. 這個插件在項目中集成非常簡單,僅需要自定義調整滾動速度.

應用于網站導航中的 15 個 jQuery 插件

2. SlimMenu – 這是一個很輕量級的jQuery插件,可以用來方便地創建極具響應性的導航菜單。使用SlimMenu,開發者不再需要再在媒體搜集上費力,也不需要 使用任何重量級插件來創建嵌套菜單。通過這個神奇的工具,可以將任何無序列表轉換為合適的包含子菜單的菜單,當在小屏幕設備中打開時可以自動變成向下平鋪 形式的導航。

應用于網站導航中的 15 個 jQuery 插件

3. FlexNav – FlexNav是另一種獨特的插件,它可以很容易地處理響應式Web頁面的任何復雜類型的菜單。這個插件支持無限級子菜單,可以在不同屏幕尺寸布局中工作。FlexNav插件對鍵盤跳轉支持良好,這樣提供了更好的訪問能力。在移動設備中它能友好地支持觸摸。

應用于網站導航中的 15 個 jQuery 插件

4. PageScroller – PageScroller是一個強大的基于js的平滑滾動導航工具,它基于強大的jQuery庫。自定義的設計提供強大的便利性,這個插件適用于任何類型的網站。你可以調節滾動速度以及自定義選擇導航菜單放置的位置。

應用于網站導航中的 15 個 jQuery 插件

5. Kwicks – Kwicks擁有可供開發者定制尺寸、屏幕寬度及間距等的選項。每個選擇的持續時間及效果都可以按照設計師的選擇定制設計。同時,在手持設備上kwicks可以水平或垂直旋轉頁面。

應用于網站導航中的 15 個 jQuery 插件

6. jBreadCrumb – jBreadCrumb是一個功能豐富的jQuery插件,它提供了一種創建面包屑導航的靈活方式。通常,面包屑表單的菜單長度很大,處理該問題的老 方法是限制菜單的數量。然而,jBreadCrumb使用另一種機制——倒置接口,根據元素的長度和數量靈活地采用不同的顯示方法。

應用于網站導航中的 15 個 jQuery 插件

7. MMenu – jQuery.mmenu是一個可以在任何移動或web布局上復制行為的插件。這個插件使用一些定制的選項將無序列表轉化為有序菜單及子菜單。Mmenu通過open、colse及切換等簡單函數來控制菜單。

應用于網站導航中的 15 個 jQuery 插件

8. DDSlick – ddSlick是個非常輕量級的JQuery插件,它用來制作可定制的下拉菜單,且運行設計師在文本旁使用圖像和描述。它提供了一個更好的頁面外觀和樣式效果。

應用于網站導航中的 15 個 jQuery 插件

9. JQuery Magic line Navigation – jQuery Magic Line Navigation允許開發著通過設置背景及下劃線來強調導航的任意特定區域。用戶對鼠標滑過及導航的不同連接可以定制不同的效果。jQuery中的動畫效果在這里也可以使用。

應用于網站導航中的 15 個 jQuery 插件

10. Navgoco – 這是一個非常簡單但很強大的jQuery插件,它可以將一個無序列表轉化成一個結構化的多層次導航。通過使用Cookie它還具有在會話間保持子菜單的能力且可用來制作手風琴菜單。

應用于網站導航中的 15 個 jQuery 插件

11. Sidr – 這是一個用來創建側邊隱藏菜單的jQuery插件。菜單可以被自定義設置為在頁面的左側或右側顯示,且多側菜單可以顯示在同一個頁面上。為適應響應式網頁布局,Sidr菜單可以附加到一個按鈕上,這已被證明對小屏幕設備是一種非常有效的導航方法。

應用于網站導航中的 15 個 jQuery 插件

12. Naver – 這是一個特性豐富的用于創建響應式導航的jQuery插件。使用這個工具可以制作活潑的導航效果且對移動設備支持良好。這個插件兼容Firefox、Safari、Chrome和IE7 +。

應用于網站導航中的 15 個 jQuery 插件

13. Easy Drop Down – 這個獨特的jQuery插件可以輕松地將元素轉化成可定制的下拉菜單導航。它具有簡潔、兼容驗證、語義標記、鍵盤控制、文本搜索、列表項內部滾動以及兼容觸摸屏設備的本地UI等特性。

應用于網站導航中的 15 個 jQuery 插件

14. JMenu – jMenu可以讓開發人員輕松創建水平樣式導航以及無限級的子菜單。它也需要jQuery UI,且支持所有JQuery UI的定制效果,如淡入或幻燈片等。頁面的外觀和風格可以在CSS文件中設定,這樣使得它很容易更新。

應用于網站導航中的 15 個 jQuery 插件

15. Menu Aim – 這是一個用來創建下拉菜單的jQuery插件,這個插件可以準確的區分用戶是試圖在一個下拉菜單項上懸停或是希望進入子菜單。Menu Aim通過檢查鼠標在屏幕上的每一個瞬間來實現這個目的。這使得它更加用戶友好適于導航。

應用于網站導航中的 15 個 jQuery 插件

這里還有許多你可以嘗試的其他jQuery插件讓你輕松完成導航效果,如Horizontal Nav、jQuery ListNav、TinyNav.js、 Flaunt.js、Smart Menus等。

 本文由用戶 jopen 自行上傳分享,僅供網友學習交流。所有權歸原作者,若您的權利被侵害,請聯系管理員。
 轉載本站原創文章,請注明出處,并保留原始鏈接、圖片水印。
 本站是一個以用戶分享為主的開源技術平臺,歡迎各類分享!