Simple slide menu, without deps
npm install rs-slide-menu
<div id="nav">
<div class="m-menu_item">
<a href="#">Shop</a>
</div>
<div class="m-menu_item">
<a href="#">About</a>
</div>
<div class="m-menu_item">
<a href="#">Contacts</a>
</div>
</div>
<button class="js-open-nav">Open</button>
<script src="rs-slide-menu.min.js"></script>
<script>
var menu = SlideMenu.init('#nav', {
toggler: '.js-open-nav'
});
</script>#nav {
display: none;
}{
"prefix": "rs-sm",
"side": "left",
"zIndex": "1500",
"bgColor": "#000",
"bgOpacity": "0.6",
"animation": {
"duration": "300",
"easing": "ease"
}
}| Option | Type | Description |
|---|---|---|
| toggler | string | css selector of togglers |
| prefix | string | prefix to all class names |
| side | string ('left', 'right') | which side show menu |
| zIndex | number | z-index of menu |
| bgColor | string | color of backdrop |
| bgOpacity | string | opacity of backdrop |
| animation | object | animation params |
| duration | string/number | transition duration in ms |
| easing | string | transition timing function |
npm run lint
npm run build
Released under the MIT License. See the bundled LICENSE file for
details.
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent