jQuery Plugin For Off-canvas Bootstrap Navigation
File Size: | 687 KB |
---|---|
Views Total: | 4654 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |
An ultra-light jQuery extension for Bootstrap that helps you create an user-friendly off-canvas push menu from the default Bootstrap navbar component in mobile view.
How to use it:
1. Make sure you have jQuery library and Bootstrap framework installed in your project.
<link href="/path/to/bootstrap.min.css" rel="stylesheet"> <script src="/path/to/jquery.min.js"></script> <script src="/path/to/bootstrap.min.js"></script>
2. Include the Bootstrap Off-Canvas Nav plugin's JavaScript and Stylesheet in the project.
<link href="bootstrap-off-canvas-nav.css" rel="stylesheet"> <script src="bootstrap-off-canvas-nav.js"></script>
3. That's it. Add the CSS class off-canvas-nav-left to your body tag to create an off-canvas push menu from your regular Bootstrap navbar that slides out from the left side of the screen when toggled.
<body class="off-canvas-nav-left">
Change log:
2016-04-20
- Make nav width dynamic when screen width <= 375px
2016-04-18
- Fix navbar-toggle for left-side off-canvas nav
2016-03-19
- Safari fix
This awesome jQuery plugin is developed by marcandrews. For more Advanced Usages, please check the demo page or visit the official website.