11个超棒的 jQuery 分步指引插件(转)
当一个网站或者一个Web应用推出新功能时,为了让用户了解你的站点(或应用)如何操作,往往都会在站点(应用)中添加一个分步指引的效果。然而这样的效果,对于不懂原生JS的同学来说,是件很头痛的事情。
下面为大家介绍一些可帮助你实现分步指引效果的jQuery插件,你可以根据自己需求定制,它们都具有一个时尚的外观,而且简单易用。
1. Intro.js
Intro.js 使用一种引导式的方式来一步步介绍你网站和项目新特性。支持键盘+鼠标的导航方式。

2. aSimpleTour
aSimpleTour 使用JSON数据进行存储配置和内容。一个浮动窗帮助管理重点元素的浏览、工具提示(可以定位)。

3. Pageguide.js
PageGuide.js 是一个利用jQuery 与 CSS3实现的交互式可视化网页向导组件,通过 PageGuide.js 可制作出友好的帮助提示。

4. Joyride
Joyride是一个jQuery插件,可以利用它来创建一个引导用户如何操作网站功能的向导。通过定义一个操作步骤顺序,这个插件会在需要操作的HTML元素旁边显示一个帮助说明的Tooltips。

5. Website Tour
一个简单但实用的插件。所有明细和内容都定义在JS中。它还提供选项来定义tooltips的位置和颜色。

6. Bootstro.js
这个是Intro.js的Bootstrap版本。

这个jQuery网站导航在Bootstrap Popovers中加载内容。导航步骤和内容都定义在JavaScript中,它拥有许多的选项来定义其行为。

这个插件拥有许多的选项来定外观和步骤之间的延迟,设置要初始显示的项目,等等。

这个插件采用CoffeeScript+Less + CSS开发,非常易于定制,可手动显示其他步骤或自动播放。可通过函数来获得当前的步骤,或者显示特定的一个步骤。

10. Trip.js
所有用引导的步骤和内容都定义在JS中,它拥有一个完整的API,支持callbacks、keyboard,并允许自定义外观。

11. Crumble
Crumble采用冒泡的界面,所有的步骤定义在一个有序的列表。

11个超棒的 jQuery 分步指引插件(转)的更多相关文章
- 11 个超棒的 jQuery 分步指引插件
当一个网站或者一个Web应用推出新功能时,为了让用户了解你的站点(或应用)如何操作,往往都会在站点(应用)中添加一个分步指引的效果.然而这样的效果,对于不懂原生JS的同学来说,是件很头痛的事情. 下面 ...
- 四款超棒的jQuery数字化签名插件
在浏览器中,我们有很多方式来绘制生成签名效果,并且有很多很棒很智能的jQuery插件.数字化签名是未来的发展方向,正是这个原因我们这里收集并且推荐了四款超棒的jQuery数字化签名插件,希望大家喜欢! ...
- 推荐10个超棒的jQuery工具 提示插件
脚本之家 http://www.jb51.net/article/28525.htm
- 30 个最棒的 jQuery 的拖放插件
jQuery 允许用户为任意 DOM 元素添加可拖放的功能,通过 jQuery 的拖放插件你可以轻松实现网页上任意元素的拖拽操作.在本文中我们向你推荐 30 个最棒的 jQuery 的拖放插件. 点击 ...
- 分享一款超棒的jQuery旋钮插件 - jQuery knob
转自:http://www.cnblogs.com/gbin1/archive/2012/05/08/2489908.html 在线演示 本地下载 如果你也在寻找一款生成漂亮旋钮(knob)的jQu ...
- 推荐15款最佳的 jQuery 分步引导插件
当用户浏览到一个网站,它可能从不知道如何浏览,如何操作网站或 Web 应用程序的内容和流程.在这篇文章中,我们编制了一些最好的 jQuery 引导插件列表.你会发现这些插件对于提高你的网站的整体用户体 ...
- jQuery 分步引导 插件
转自:http://blog.libnav.com/js/57.html 很多时候一个网站或者一个Web应用出品,为了让你的用户知道你的站点(或应用)有些什么?如何操作?为了让你的用户有更好的体验.往 ...
- 20 个非常棒的jQuery内容滑动插件
Wow Slider WOW Slider是一款小巧易用的网页滑块设计.该软件内置大量的模版和工具,让你轻松设计出完美的视觉效果.他还可以帮助用户在短时间内创造出梦幻般的滑块,而无需编码和图像编辑, ...
- 一款超炫的jquery图片播放插件[Cloud Carousel]
今天给大家介绍一个jquery图片播放插件,也可以说是一款幻灯片放映插件,它叫Cloud Carousel,支持自动播放.图片预览.鼠标滚轮滚动,非常酷,下图是效果预览. 该jquery图片播放项目演 ...
随机推荐
- [转]HSPICE软件的应用及常见问题解决
HSPICE常用分析类型 直流分析(DC Analysis)( 参见HSPICE User’s Manual (1)3-4 ) 常用命令: .OP 直流工作点分析 .NODESET 节点设置 .SEN ...
- 免费申请 Github 私有仓库--学生和教育人士的福利
免费申请 Github 私有仓库 -学生和教育人士的福利 Github 是全球知名的软件项目托管网站.在 Github 创建私有仓库是需要收费的,收费方案有多种,费用最小的方案是每月 7 美元的“微型 ...
- js之正则表达式详解
文章前提:会写几本的正则表达式,本文主要讲解js中关于正则方法的运用. (关于正则元字符可以查看http://www.php100.com/html/webkaifa/javascript/2010/ ...
- (部署)使用kubernetes的deployment进行RollingUpdate
rolling update,可以使得服务近乎无缝地平滑升级,即在不停止对外服务的前提下完成应用的更新. replication controller与deployment的区别 replicatio ...
- opencv源代码之中的一个:cvboost.cpp
我使用的是opencv2.4.9.安装后.我的cvboost..cpp文件的路径是........\opencv\sources\apps\haartraining\cvboost.cpp.研究源代码 ...
- Android:你不知道的 WebView 使用漏洞
前言 如今非常多App里都内置了Web网页(Hyprid App),比方说非常多电商平台.淘宝.京东.聚划算等等.例如以下图 上述功能是由 Android的WebView 实现的.可是 WebView ...
- [sh]sed 4个功能
[root@lanny test]# cat test.txt test liyao lanny 经典博文: http://oldboy.blog.51cto.com/2561410/949365 h ...
- win32串口编程
翻译自:ms-help://MS.MSDNQTR.v80.chs/MS.MSDN.v80/MS.WIN32COM.v10.en/dnfiles/html/msdn_serial.htm 老外写的文章, ...
- C++面向对象程序设计的一些知识点(1)
1.函数重载而不出错是有条件的: (1).这些函数位于同一域内,如同一类中.同一文件中. (2).这些同名函数具有不同的参数特征标(特征标是指形參的个数.类型.排列顺序等). 2.引用特性(与指针对比 ...
- C++Primer 4th edition读书笔记-第二章
1 变量的定义用于为变量分配存储空间,还可以为变量指定初始值.在一个程序中,变量有且只有一个定义.声明用于向程序表明变量的名字和类型.定义也是声明:当定义变量时,我们声明了它的类型和名字.可以通过使用 ...