[英]Bootstrap Tour Not Working
我正在為我設置的一個非常簡單的測試頁面測試 Bootstrap Tour。 內容顯示,但由於某種原因,游覽功能沒有啟動。 有人能告訴我我可能做錯了什么嗎?
謝謝:)
請在下面找到我的代碼
<html>
<head>
<meta charset="utf-8">
<title> This is a testing page for bootstrap tour </title>
<link href="../bootstrap/css/bootstrap.min.css" rel="stylesheet">
<link href="../bootstraptour/build/css/bootstrap-tour.min.css" rel="stylesheet">
<link href="../bootstraptour/build/css/bootstrap-tour-standalone.min.css" rel="stylesheet">
</head>
<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script src="../bootstrap/js/jquery.min.js"></script>
<script src="../bootstrap/js/bootstrap.min.js"></script>
<script src="../bootstraptour/build/js/bootstrap-tour.min.js"></script>
<script src="../bootstraptour/build/js/bootstrap-tour-standalone.min.js"></script>
<script>
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 my step" // string - content of the popover
}, {
element: "#content1",
title: "Title of my step",
content: "Content of my step"
}]);
// Initialize the tour
tour.init();
// Start the tour
tour.start();
</script>
<body>
<div id="content">
Hello, World!
</div>
<br>
<br>
<br>
<div id="content1">
Another Hello, World!
</div>
</body>
</html>
你應該既包括bootstrap-tour.min.css/bootstrap-tour.min.js
(當你包括bootstrap.min.css/bootstrap.min.js
自己)或bootstrap-tour-standalone.min.css/bootstrap-tour-standalone.min.js
,但不能兩者兼而有之。 請參閱bootstrap 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 my step" // string - content of the popover }, { element: "#content1", title: "Title of my step", content: "Content of my step" }]); // Initialize the tour tour.init(); // Start the tour tour.start();
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-tour/0.11.0/js/bootstrap-tour-standalone.min.js"></script> <link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-tour/0.11.0/css/bootstrap-tour-standalone.min.css" rel="stylesheet"/> <div id="content"> Hello, World! </div> <br> <br> <br> <div id="content1"> Another Hello, World! </div>
您需要清除本地存儲,因為引導程序使用 localStorage。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.