11個非常棒“jQuery的網站導航插件”用于指導用戶使用網站新功能

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

當一個網站或者一個Web應用推出新功能時,為了讓用戶知道你的站點(或應用)如何操作?為了讓你的用戶有更好的體驗。往往這個時候都會給你的站點(應用)添加一個分步指引的效果。然而這樣的效果,對于不懂原生js的同學來說,是件蠻頭痛的事情。下面為大家介紹這樣一些jQuery插件幫助你實現分步指引的效果,你可以根據自己需求定制,更強的是他們都具有一個時尚的外觀效果,而且簡單易用。

Intro.js

11個非常棒“jQuery的網站導航插件”用于指導用戶使用網站新功能

Intro.js 使用一種引導式的方式來一步步介紹你網站和項目新特性。支持鍵盤+鼠標的導航方式。

aSimpleTour

11個非常棒“jQuery的網站導航插件”用于指導用戶使用網站新功能

aSimpleTour 使用JSON數據進行存儲配置和內容。

一個浮動窗幫助管理重點元素游覽,工具提示可以定位

Pageguide.js

11個非常棒“jQuery的網站導航插件”用于指導用戶使用網站新功能

PageGuide. js 是一個利用jQuery 與 CSS3實現的交互式可視化網頁向導組件,通過 PageGuide.js 可制作出友好的幫助提示。

Joyride

11個非常棒“jQuery的網站導航插件”用于指導用戶使用網站新功能

Joyride是一個jQuery插件,可以利用它來創建一個引導用戶如何操作網站功能的向導。通過定義一個操作步驟順序,這個插件會在需要操作的HTML元素旁邊顯示一個幫助說明的Tooltips。

Website Tour

11個非常棒“jQuery的網站導航插件”用于指導用戶使用網站新功能

一個簡單,但實用的插件。所有明細和內容都定義在JS中。它還提供選項來定tooltips的位置和顏色。

Bootstro.js

11個非常棒“jQuery的網站導航插件”用于指導用戶使用網站新功能

這個是Intro.js的Bootstrap版本。

Bootstrap Tour

11個非常棒“jQuery的網站導航插件”用于指導用戶使用網站新功能

這個jQuery網站導航在Bootstrap Popovers中加載內容。

導航步驟和內容都定義在JavaScript中,它擁有許多的選項來定義其行為。

jQuery Site Tour

11個非常棒“jQuery的網站導航插件”用于指導用戶使用網站新功能

這個插件擁有許多的選項來定外觀和步驟之間的延遲設置初始顯示項目等等

jQuery TourBus

11個非常棒“jQuery的網站導航插件”用于指導用戶使用網站新功能

這個插件采用CoffeeScript+Less + CSS開發。

jQuery TourBus 非常易于定制,可手動顯示其他步驟自動播放

函數來獲得當前步驟或者顯示特定的一個步驟

Trip.js

11個非常棒“jQuery的網站導航插件”用于指導用戶使用網站新功能

所有用引導的步驟和內容都定義在JS中,它擁有一個完整的API,支持callbacks, keyboard。并能夠自定義外觀。

Crumble

11個非常棒“jQuery的網站導航插件”用于指導用戶使用網站新功能

以一種不同的可視化方式來引導用戶瀏覽網站。

Crumble使用采用冒泡的界面,所有的步驟定義在一個有序的列表

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