6
6
## How to use
7
7
Intro.js can be added to your site in three simple steps:
8
8
9
- ** 1)** Include ` intro.js ` and ` introjs.css ` (or the minified version for production) in your page.
9
+ ** 1)** Include ` intro.js ` and ` introjs.css ` (or the minified version for production) in your page.
10
+
11
+ > Note: if you need Internet Explorer compatiblity, you have to add introjs-ie.css to the page also:
12
+
13
+ ``` html
14
+ <!-- [if lte IE 8]>
15
+ <link href="../introjs-ie.css" rel="stylesheet">
16
+ <!-- <![endif]-->
17
+ ````
10
18
11
19
**2)** Add `data-intro` and `data-step` to your HTML elements.
12
20
@@ -49,7 +57,9 @@ Creating an introJs object.
49
57
introJs() //without selector, start introduction for whole page
50
58
introJs("#intro-farm") //start introduction for element id='intro-farm'
51
59
````
52
-
60
+
61
+ -----
62
+
53
63
###introJs.start()
54
64
55
65
Start the introduction for defined element(s).
@@ -63,6 +73,85 @@ Start the introduction for defined element(s).
63
73
```javascript
64
74
introJs().start()
65
75
````
76
+ -----
77
+
78
+ ###introJs.goToStep(step)
79
+
80
+ Go to specific step of introduction.
81
+
82
+ **Available since**: v0.3.0
83
+
84
+ **Parameters:**
85
+ - step : Number
86
+
87
+ **Returns:**
88
+ - introJs object.
89
+
90
+ **Example:**
91
+ ```javascript
92
+ introJs().goToStep(2).start(); //starts introduction from step 2
93
+ ````
94
+
95
+ -----
96
+
97
+ ###introJs.exit()
98
+
99
+ Exit the introduction.
100
+
101
+ **Available since**: v0.3.0
102
+
103
+ **Returns:**
104
+ - introJs object.
105
+
106
+ **Example:**
107
+ ```javascript
108
+ introJs().exit()
109
+ ````
110
+
111
+ -----
112
+
113
+ ###introJs.setOption(option, value)
114
+
115
+ Set a single option to introJs object.
116
+
117
+ **Available since**: v0.3.0
118
+
119
+ **Parameters:**
120
+ - option : String
121
+ Option key name.
122
+
123
+ - value : String/Number
124
+ Value of the option.
125
+
126
+ **Returns:**
127
+ - introJs object.
128
+
129
+ **Example:**
130
+ ```javascript
131
+ introJs().setOption("skipLabel", "Exit");
132
+ ````
133
+
134
+ ----
135
+
136
+ ###introJs.setOptions(options)
137
+
138
+ Set a group of options to the introJs object.
139
+
140
+ **Available since**: v0.3.0
141
+
142
+ **Parameters:**
143
+ - options : Object
144
+ Object that contains option keys with values.
145
+
146
+ **Returns:**
147
+ - introJs object.
148
+
149
+ **Example:**
150
+ ```javascript
151
+ introJs().setOptions({ skipLabel: "Exit", tooltipPosition: "right" });
152
+ ````
153
+
154
+ ----
66
155
67
156
###introJs.oncomplete(providedCallback)
68
157
@@ -83,6 +172,8 @@ introJs().oncomplete(function() {
83
172
});
84
173
````
85
174
175
+ -----
176
+
86
177
###introJs.onexit(providedCallback)
87
178
88
179
Set callback to exit of introduction. Exit also means pressing `ESC` key and clicking on the overlay layer by the user.
@@ -102,6 +193,27 @@ introJs().onexit(function() {
102
193
});
103
194
````
104
195
196
+ -----
197
+
198
+ ###introJs.onchange(providedCallback)
199
+
200
+ Set callback to change of each step of introduction. Given callback function will be called after completing each step.
201
+
202
+ **Available since:** v0.3.0
203
+
204
+ **Parameters:**
205
+ - providedCallback : Function
206
+
207
+ **Returns:**
208
+ - introJs object.
209
+
210
+ **Example:**
211
+ ```javascript
212
+ introJs().onchange(function() {
213
+ alert("new step");
214
+ });
215
+ ````
216
+
105
217
## Using with:
106
218
107
219
### Rails
@@ -121,10 +233,21 @@ Now you can run this command to minify all static resources:
121
233
122
234
123
235
## Roadmap
236
+ - Multi-page introduction
124
237
- More browser compatibility
125
238
126
239
127
240
## Release History
241
+ * **v0.3.0** - 2013-03-28
242
+ - Adding support for CommonJS, RequireJS AMD and Browser Globals.
243
+ - Add `goToStep` function to go to specific step of introduction.
244
+ - Add `onchange` callback.
245
+ - Add `exit` function to exit from introduction.
246
+ - Adding options with `setOption` and `setOptions` functions.
247
+ - More IE compatibility.
248
+ - Fix `min-width` bug with tooltip box.
249
+ - Code cleanup + Better coding style.
250
+
128
251
* **v0.2.1** - 2013-03-20
129
252
- Fix keydown event unbinding bug.
130
253
0 commit comments