jQuery NiftyModals
This is a jQuery plugin version of the Codrops ModalWindowEffects.
Getting Started
- Install with bower:
bower install foxythemes-niftymodals
- Or download the latest release zip file
Add script and style
Include css & js file in your html head:
Modal Markup
Modals have a required markup in order to apply the necessary styles:
<!-- your content -->
You'll need to create the modal overlay just after the modal element: <div class="md-overlay"></div>
Calling modal by tag attribute
You can use this option by adding the md-trigger
class to an element, for example a button or link. You also need to specify the modal id using the data-modal="modal-id"
data attribute like this:
Show Modal
Show modal using JavaScript
This option only requires the basic modal markup and the you can show the modal like this:
;
To use this method you'll be able to set some additional options and apply them to the modal:
;
Setting defaults
You can set the default options like this:
$fn;
Integrate with bootstrap modals style
In order to integrate with bs modals style you'll need to load the css bootstrap adapter instead of the default one:
This file contains only the essential css, this way you can use the bs classes like modal-header
, modal-content
& modal-footer
.
Contributing
- Fork it!
- Create your feature branch:
git checkout -b my-new-feature
- Commit your changes:
git commit -am 'Add some feature'
- Push to the branch:
git push origin my-new-feature
- Submit a pull request :D
License
Integrate or build upon it for free in your personal or commercial projects. Please contact us first if you want to publish or sell ports (for example WordPress or Joomla plugins). Don't republish, redistribute or sell it "as-is".
Read more here: http://tympanus.net/codrops/licensing/