Bootstrap Tour的项目主页
http://bootstraptour.com/
下面是引用主页中的教程
添加引用
<link href="bootstrap-tour-standalone.min.css" rel="stylesheet">
...
<script src="jquery.min.js"></script>
<script src="bootstrap-tour-standalone.min.js"></script>
设置引导
// Instance the tour
var tour = new Tour({
steps: [
{
element: "#my-element",
title: "Title of my step",
content: "Content of my step"
},
{
element: "#my-other-element",
title: "Title of my step",
content: "Content of my step"
}
]});
// Initialize the tour
tour.init();
// Start the tour
tour.start();
最后最好添加一个触发事件来启动引导,比如单击某个段落
$("p").click(function(){
tour.start();
});
注意,这里用的是tour.start();
这样的话,引导提示在第一次打开后就无法重新打开了,就算是关掉浏览器重新打开页面都不行的。怎么解决呢。其实很简单,
只要将tour.start();改成tour.restart();就可以了。