Simple Responsive jQuery Modal Dialog Plugin - Baze Modal

File Size: 96.3 KB
Views Total: 5867
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
Simple Responsive jQuery Modal Dialog Plugin - Baze Modal

Baze Modal is a jQuery plugin to display responsive, animated modal dialog with CSS3 powered animations that slide out from the top of your web page when triggered.

How to use it:

1. Load the jQuery Baze Modal plugin's stylesheet for basic modal styles/animations.

<link rel="stylesheet" href="baze.modal.css">

2. Load jQuery library and the jQuery Baze Modal plugin's script at the bottom of your web page.

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="baze.modal.js"></script>

3. Wrap the modal content you want to popup into a DIV container as follow.

<div class="bzm-content" id="modal-demo" data-title="Modal title">
  <p>Modal content</p>
</div>

4. Create a button to trigger the modal dialog.

<button id="demo" data-target="#modal-demo">click me</button>

5. Call the plugin on the trigger button and done.

$('#demo').bazeModal();

6. Callback events supported:

$('#demo').bazeModal({

// fired when the modal dialog is opened
onOpen: null,

// fired when the modal dialog is closed
onClose: null

});

Change logs:

2015-01-12

  • v1.2.0

2015-01-09

  • v1.1.0

This awesome jQuery plugin is developed by ImBobby. For more Advanced Usages, please check the demo page or visit the official website.