About
jQuery mdStrap plugin creates a side menu for smartphones or other handheld devices. It's built based on Twitter Bootstrap's framework version 4 (currently alpha 2).Plugin installation
First, you'll have to include the necessary CSS stylesheets into the <head>
section.
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://cdn.rawgit.com/twbs/bootstrap/v4-dev/dist/css/bootstrap.css" />
<!-- mdStrap Menu -->
<link rel="stylesheet" href="css/mdstrap.css" />
Second, you'll have to add the JS just before the closing </body>
tag. Being a jQuery plugin, don't forget to add the jQuery library before.
<!-- jQuery library -->
<script src="//code.jquery.com/jquery-1.10.2.min.js"></script>
<!-- jQuery mdStrap -->
<script src="jquery-mdstrap.js"></script>
And that's it.
Pre-Processors
If you are working with CSS pre-processors, you can @import
the style into your project for better organization.
@import '/path/to/jquery-mdstrap'
As of this moment, only the SASS version is available.
Usage
To enable the plugin, you'll just need to call the function on the element containing the navigation.
jQuery(document).ready(function($) {
// Call with default params
$('.navbar-nav').mdStrap();
// Call with custom params
$('.navba-rnav').mdStrap({
'key1' => 'value1',
'key2' => 'value2',
});
});
Options
Development
This plugin is in continuous development, so expect changes to occur. To get the latest changes, visit this page and the repo itself at https://www.github.com/corneliucirlan/mdstrap