插件描述：jQuery引导插件TourTip 交互式可视化指南网页上的元素。
使用方法
使用方法
步骤1：
将以下标记添加到您的文档的<head>
你还需要复制旁边插件的css文件夹和下载的IMG文件夹。你就会有你需要启动一个引导网页的一切。
/ *附加的Tourtip CSS文件* /
<link rel=" stylesheet" type="text/css" href="css/tinytools.tourtip.min.css">
/ * jQuery的需要连接* /
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
/ *然后连接TourTip插件* /
<script src="tinytools.tourtip.min.js"></script>
步骤2：
准备布局引导元素
有没有必要有任何容器为每个漫游单元。你只需要介绍你的页面上的引导元素，插件，并设置必要的选项。例如，假设你有标识为TourElement1的div元素。把下面的代码在你的文档的ready事件来创建一个引导布局所提到的div元素：
<script>
$(document).ready(function () {
$("#TourElement1").tourTip({
title: "Tour Title",
description: "This is a description for the newly born TourTip :)",
previous: true,
position: 'right'
});
});
</script>
你可以游览布局不绑定到任何预定义的元素;在这种情况下，仅仅通过直接调用的tourtip创造公共方法创建引导元：
<script>
$(document).ready(function () {
$.tourTip.create({
title: "Tour Title",
description: "This is a description for the newly born TourTip :)",
previous: true,
position: 'right'
});
});
</script>
第3步：
启动发动机
至此，你会看到你的页面上没有TourTip 。只需调用start public方法来启动巡演引擎：
<script>
$(document).ready(function () {
$.tourTip.start();
});
</script>
或者，你可以通过设置来启动方法。在start方法中的设置将应用到所有的引导布局一次。您另行申请各引导布局的设置，将覆盖常规设置。
来源：知乎 链接：https://www.zhihu.com/question/43951047/answer/102405925