Skip to content

Commit 20782bd

Browse files
pazguillepazguille
committed
Merge branch 'feature-add-slideout-events' of github.com:Mango/slideout into feature-add-slideout-events
2 parents fdb27fd + 0df89f0 commit 20782bd

7 files changed

Lines changed: 195 additions & 174 deletions

File tree

‎README.md‎

Lines changed: 23 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@
2323

2424
$ spm install slideout
2525

26-
$ bower install https://github.com/Mango/slideout.git
26+
$ bower install slideout.js
2727

2828
$ component install mango/slideout
2929

@@ -154,7 +154,7 @@ Then you just include Slideout.js and create a new instance with some options:
154154

155155
<main id="panel">
156156
<header>
157-
<button>☰</button>
157+
<button class="toggle-button">☰</button>
158158
<h2>Panel</h2>
159159
</header>
160160
</main>
@@ -167,6 +167,11 @@ Then you just include Slideout.js and create a new instance with some options:
167167
'padding': 256,
168168
'tolerance': 70
169169
});
170+
171+
// Toggle button
172+
document.querySelector('.toggle-button').addEventListener('click', function() {
173+
slideout.toggle();
174+
});
170175
</script>
171176

172177
</body>
@@ -287,6 +292,22 @@ $ npm test
287292
$ npm run hint
288293
```
289294

295+
## FAQ
296+
297+
### How to add a toggle button.
298+
299+
```js
300+
// vanilla js
301+
document.querySelector('.toggle-button').addEventListener('click', function() {
302+
slideout.toggle();
303+
});
304+
305+
// jQuery
306+
$('.toggle-button').on('click', function() {
307+
slideout.toggle();
308+
});
309+
```
310+
290311
## With ❤ by
291312
- Guille Paz (Front-end developer | Web standards lover)
292313
- E-mail: [guille87paz@gmail.com](mailto:guille87paz@gmail.com)

‎bower.json‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
{
2-
"name": "slideout",
2+
"name": "slideout.js",
33
"repository": "git@github.com:mango/slideout.git",
44
"description": "A touch slideout navigation menu for your mobile web apps.",
55
"author": "Guille Paz <guille87paz@gmail.com>",
6-
"version": "0.1.1",
6+
"version": "0.1.6",
77
"dependencies": {
88
"decouple": "0.0.1"
99
},

‎component.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
"repo": "mango/slideout",
44
"description": "A touch slideout navigation menu for your mobile web apps.",
55
"author": "Guille Paz <guille87paz@gmail.com>",
6-
"version": "0.1.1",
6+
"version": "0.1.6",
77
"twitter": "@mango",
88
"keywords": [
99
"slideout",

0 commit comments

Comments
 (0)