This repository has been archived by the owner on Feb 17, 2021. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 666
/
index.html
101 lines (101 loc) · 3.21 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<!--
<link href="css/hopscotch.less" rel="stylesheet/less"></link>
<link href="css/bounce.less" rel="stylesheet/less"></link>
<script src="js/less-1.3.0.min.js"></script>
-->
<link href="css/hopscotch.css" rel="stylesheet"></link>
<style>
body {
font-family: Helvetica, Arial;
}
#pageTitle {
text-align: center;
}
#debug {
background-color: #fff;
border: 5px solid #000;
padding: 20px;
position: absolute;
top: 0;
right: 0;
}
#debug h3 {
margin: 10px 0;
}
.img-container {
text-align: center;
}
</style>
</head>
<body>
<h1 id="pageTitle">My Test Page</h1>
<div id="content">
<h2 id="subheading" class="one two three">Content</h2>
<ul id="my-list">
<li>Welcome to my hopscotch test page</li>
<li>Welcome to my hopscotch test page</li>
<li>Welcome to my hopscotch test page</li>
<li>Testing multi-page tours. Continue to the <a href="secondpage.html" id="secpagelink" title="hello tooltip">hopscotch</a> second page</li>
</ul>
<div class="img-container">
<img id="wave" src="http://i.imgur.com/s632o.jpg">
</div>
<div class="img-container">
<img id="python" src="http://i.imgur.com/mIgyw.jpg">
</div>
<div class="img-container">
<img id="mission" src="http://cdn.theatlanticcities.com/img/upload/2012/07/19/20120719-mission1/largest.jpg">
</div>
</div>
<div id="debug">
<h2>Debug controls</h2>
<input id="startBtn" type="button" value="Start">
<input id="endBtn" type="button" value="End">
<h3>Tour Options</h3>
<label>
<input type="checkbox" id="animateCheck"> animate
</label>
<br/>
<label>
<input type="checkbox" id="smoothScrollCheck" checked=""> smoothScroll
</label>
<br/>
<label>
<input type="checkbox" id="showCloseButtonCheck"> showCloseButton
</label>
<br/>
<label>
<input type="checkbox" id="showPrevButtonCheck" checked=""> showPrevButton
</label>
<br/>
<label>
<input type="checkbox" id="showNextButtonCheck" checked=""> showNextButton
</label>
<br/>
<label>
<input type="checkbox" id="showAsianStepNumsCheck"> showAsianStepNums
</label>
<br/>
<label>Go to step number: <input id="gototext" type="text" size="5"><input id="gotobtn" type="button" value="Go!"></label>
</div>
<!--
<script src="js/yui/build/yahoo-dom-event/yahoo-dom-event.js"></script>
<script src="js/yui/build/animation/animation-min.js"></script>
<script src="js/jquery-1.7.2.js"></script>
<script src="bootstrap/js/bootstrap-tooltip.js""></script>
<script src="bootstrap/js/bootstrap-popover.js""></script>
-->
<script src="js/hopscotch.js"></script>
<script src="js/exampletour.js"></script>
<script src="js/debug.js"></script>
<script>
hopscotch.loadTour(tour);
//hopscotch.clearCookie();
hopscotch.startTour();
</script>
</body>
</html>