1
+ <!DOCTYPE html>
2
+ <!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
3
+ <!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
4
+ <!--[if IE 8]> <html class="no-js lt-ie9"> <![endif]-->
5
+ <!--[if gt IE 8]><!--> < html class ="no-js "> <!--<![endif]-->
6
+ < head >
7
+ < meta charset ="utf-8 ">
8
+ < meta http-equiv ="X-UA-Compatible " content ="IE=edge,chrome=1 ">
9
+ < title > jQeury.steps Demos</ title >
10
+ < meta name ="description " content ="">
11
+ < meta name ="viewport " content ="width=device-width ">
12
+ < link rel ="stylesheet " href ="css/normalize.css ">
13
+ < link rel ="stylesheet " href ="css/main.css ">
14
+ < link rel ="stylesheet " href ="css/jquery.steps.css ">
15
+ < script src ="../lib/modernizr-2.6.2.min.js "> </ script >
16
+ < script src ="../lib/jquery-1.9.1.min.js "> </ script >
17
+ < script src ="../build/jquery.steps.js "> </ script >
18
+ </ head >
19
+ < body >
20
+ <!--[if lt IE 7]>
21
+ <p class="chromeframe">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> or <a href="http://www.google.com/chromeframe/?redirect=true">activate Google Chrome Frame</a> to improve your experience.</p>
22
+ <![endif]-->
23
+
24
+ < header >
25
+ < h1 > Wizard Demo</ h1 >
26
+ < nav >
27
+ < ul >
28
+ < li > < a href ="index.html "> Basic</ a > </ li >
29
+ < li > < a href ="vertical.html "> Vertical</ a > </ li >
30
+ < li > < a href ="multiple.html "> Multiple Wizard</ a > </ li >
31
+ < li > < a href ="async-iframe.html "> Async/Iframe Content</ a > </ li >
32
+ < li > < a href ="form.html "> Step Validation</ a > </ li >
33
+ < li > < a href ="add-remove.html "> Add/Remove Steps via API</ a > </ li >
34
+ </ ul >
35
+ </ nav >
36
+ </ header >
37
+
38
+ < div class ="content ">
39
+ < h1 > Basic Demo</ h1 >
40
+
41
+ < script >
42
+ $ ( function ( )
43
+ {
44
+ $ ( "#wizard" ) . steps ( {
45
+ headerTag : "h2" ,
46
+ bodyTag : "section"
47
+ } ) ;
48
+ $ ( "#wizard" ) . steps ( "add" , {
49
+ title : "Fifth Step" ,
50
+ content : "New!"
51
+ } ) ;
52
+ $ ( "#wizard" ) . steps ( "insert" , 1 , {
53
+ title : "Second Step" ,
54
+ content : "New!"
55
+ } ) ;
56
+ $ ( "#wizard" ) . steps ( "remove" , 2 ) ;
57
+ } ) ;
58
+ </ script >
59
+
60
+ < div id ="wizard ">
61
+ < h2 > First Step</ h2 >
62
+ < section >
63
+ < p > Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer ut nulla nunc. Maecenas arcu sem, hendrerit a tempor quis,
64
+ sagittis accumsan tellus. In hac habitasse platea dictumst. Donec a semper dui. Nunc eget quam libero. Nam at felis metus.
65
+ Nam tellus dolor, tristique ac tempus nec, iaculis quis nisi.</ p >
66
+ </ section >
67
+
68
+ < h2 > Second Step</ h2 >
69
+ < section >
70
+ < p > Donec mi sapien, hendrerit nec egestas a, rutrum vitae dolor. Nullam venenatis diam ac ligula elementum pellentesque.
71
+ In lobortis sollicitudin felis non eleifend. Morbi tristique tellus est, sed tempor elit. Morbi varius, nulla quis condimentum
72
+ dictum, nisi elit condimentum magna, nec venenatis urna quam in nisi. Integer hendrerit sapien a diam adipiscing consectetur.
73
+ In euismod augue ullamcorper leo dignissim quis elementum arcu porta. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
74
+ Vestibulum leo velit, blandit ac tempor nec, ultrices id diam. Donec metus lacus, rhoncus sagittis iaculis nec, malesuada a diam.
75
+ Donec non pulvinar urna. Aliquam id velit lacus.</ p >
76
+ </ section >
77
+
78
+ < h2 > Third Step</ h2 >
79
+ < section >
80
+ < p > Morbi ornare tellus at elit ultrices id dignissim lorem elementum. Sed eget nisl at justo condimentum dapibus. Fusce eros justo,
81
+ pellentesque non euismod ac, rutrum sed quam. Ut non mi tortor. Vestibulum eleifend varius ullamcorper. Aliquam erat volutpat.
82
+ Donec diam massa, porta vel dictum sit amet, iaculis ac massa. Sed elementum dui commodo lectus sollicitudin in auctor mauris
83
+ venenatis.</ p >
84
+ </ section >
85
+
86
+ < h2 > Forth Step</ h2 >
87
+ < section >
88
+ < p > Quisque at sem turpis, id sagittis diam. Suspendisse malesuada eros posuere mauris vehicula vulputate. Aliquam sed sem tortor.
89
+ Quisque sed felis ut mauris feugiat iaculis nec ac lectus. Sed consequat vestibulum purus, imperdiet varius est pellentesque vitae.
90
+ Suspendisse consequat cursus eros, vitae tempus enim euismod non. Nullam ut commodo tortor.</ p >
91
+ </ section >
92
+ </ div >
93
+ </ div >
94
+ </ body >
95
+ </ html >
0 commit comments