#Bootstrap extra modal Demo
A wrapper to the Bootstrap 3 modal Javascript we developed at HOKO. It uses the HTML already on the page (the modal 'container' and adds remote HTML to it).
Dependencies
Installation
Via npm
npm install bootstrap-extra-modal
Manually
Download the project and include the sources inside your head tag. Make sure you include the files after including jQuery and Bootstrap 3 sources
<!-- jQuery src --> <!-- Bootstrap 3 src --> <link rel="stylesheet" type="text/css" href="your/folder/bootstrap-extra-modal.css"> <script src="your/folder/bootstrap-extra-modal.min.js" type="text/javascript"></script>
How to use:
Via data attributes
<button data-em-selector="#fancyModal" data-em-position="left" data-em-push-content="true">Ignite!</button>
Via JavaScript
$('#fancyModal').bootstrapExtraModal(options).show();
Options
Name | Type | Default | Description |
---|---|---|---|
position | string | 'default' | Position of the modal (can be 'default', 'right', 'left') |
pushContent | boolean | false | Option used to move the boby depending on 'position' |
openAnimation | string | 'jelly' | This will add a css class containing an animation |
closeAnimation | string | 'unjelly' | This will add a css class containing an animation |
reload | boolean | false | Reload page when closing the modal |
css | string | '' | Custom css class to be added to the modal container |
Run:
npm install
Then:
grunt watch
Contributing
Pull Requests are always welcome!