Intro.js的简介和用法

2021-07-07

Intro.js 是一个开源的 Javascript / CSS 库，可用来创建添加循序渐进的介绍或提示。

依赖#

Intro.js 没有任何依赖，你需要做的仅仅是添加 JS 和 CSS 文件。

作者

Afshin Mehrabani，bozdoz

安装

使用bower:

bower install intro.js --save

或者使用 npm:

npm install intro.js --save

安装 Introjs 以后, 添加 data-intro 和 data-step 到你的HTML元素。

例如:

<a href='http://example.com/' data-intro='Hello step one!'></a>

这里看全部的元素。

最后，调用这个 JavaScript 函数：

introJs().start();

另外, 可以给introJs函数传递一个参数来限制展示的区域。

introJs(".introduction-farm").start();

仅对具有class='introduction-farm'的元素运行简介。

添加提示

你应该在元素上使用data-hint属性来添加提示。

例如:

<a href='http://example.com/' data-hint='Hello step one!'></a>

然后调用此JavaScript函数向页面添加提示：

introJs().addHints();