一旦到达第二页,我就无法在多页巡视中启动Bootstrap Tour.
我有一个点击事件的旅游开始,并localStorage设置为false.通过点击活动,游览开始很好,但是当我进入游览的第二步并加载新页面时,游览不会从它停止的地方开始.
如何在这个新页面上继续从第二步开始巡演？我知道我需要重新初始化巡视,但我显然没有正确地做到这一点.
$(document).ready(function () {
// Instance the tour
var tour = new Tour({
name: "CiteTour",
steps: [{
element: "",
title: "#1",
content: "You can find help with formatting citations on the Guide page. Click 'Next' to go there now.",
placement: ""
}, {
element: "#CiteTour2",
title: "#2 - Citation Resources",
content: "There are several options for getting help with formatting citations. Once on the Guide page, look for the box labeled 'Citation Help.'", …有关说明,有两页:
index.html (在此页面的帮助下,弹出窗口中的下一个按钮,我将遍历下面提到的第二页)
product_detail.html (从此页面如果我想使用prev按钮返回index.html,弹出窗口关闭,没有任何反应)
custom.js的内容:
var tour = new Tour({
storage : false,
steps: [
{
element: "#ture-one",
title: "",
placement: "bottom",
content: "<p>This is the Deployment Manager Dashboard.</p><p>It shows you which versions of your software are deployed to your different environments.</p>"
},
{
element: "#ture-two",
title: "",
placement: "bottom",
content: "<p>This is the Deployment Manager Dashboard.</p><p>It shows you which versions of your software are deployed to your different environments.</p>"
},
{
element: "#ture-three",
title: "",
placement: "bottom",
content: …<!DOCTYPE html>
<html lang="en">
<head>
<title>Trello Inspired</title>
<link rel="stylesheet" href="https://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
<link rel="stylesheet" href="../css/plugins/bootstrap-tour.min.css">
<link rel="stylesheet" href="style.css" type="text/css" media="screen" charset="utf-8" />
</head>
<body>
<div class="left-container">
<span class="logo"><h2>Title 2</h2></span>
<p class="left-msg welcom-msg">Now that registration and filling out forms is out the way, let's get you all set up.</p>
<p class="left-msg need-enrol">First you'll need to enrol to an exam.</p>
</div>
<div class="right-container">
<button class="btn btn-default enrol-btn" id="enrol-btn1" data-toggle="popover" data-placement="left">Enrol</button>
<button class="btn btn-default start-exam-btn" style="display:none;">Preparation</button>
</div>
</body>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<script src="../js/libs/bootstrap.min.js"></script>
<script src="../js/plugins/bootstrap-tour.min.js"></script> …再会！
我刚刚开始在我们的项目中使用 Bootstrap Tour，我似乎喜欢它，因为它简单而实用的界面。但我只有一个小问题 - 如何让游览突出显示的元素暂时禁用？
例如，如果游览的当前亮点位于一组按钮上，是否有办法使用户在游览时无法单击它们？
任何帮助将非常感激！:)
我在页面中有这个代码.我正在尝试使用bootstrap-tour工作,但它没有发生.我究竟做错了什么？我在这里错过了什么？
<!DOCTYPE html>
<html>
<head>
<link href="bootstrap.css" rel="stylesheet">
<link href="bootstrap-tour.css" rel="stylesheet">
<link href="bootstrap-tour.min.css" rel="stylesheet">
<!--[if lt IE 9]><script src="html5shiv.js"><![endif]-->
<script>
// Instance the tour
var tour = new Tour();
// Add your steps. Not too many, you don't really want to get your users sleepy
tour.addSteps([
{
element: "#content", // string (jQuery selector) - html element next to which the step popover should be shown
title: "Title of my step", // string - title of the popover
content: "Content of …