Simple Ajax-enabled jQuery Modal Plugin - Overthrow

Overthrow is a small and easy-to-use jQuery plugin to create plain, nice clean modal windows that support both inline elements and dynamic content loaded via Ajax request.

How to use it:

1. Load jQuery library and the jQuery overthrow plugin's file in the web page.

<link href="css/overthrow.css" rel="stylesheet">

<script src="//code.jquery.com/jquery-1.11.2.min.js"></script>
<script src="js/jquery.overthrow.js"></script>

2. Create hidden content to be displayed into the modal window.

<div id="content" style="display:none;">
  <h1>Modal Title</h1>
  <p>Modal content goes here.</p>
</div>

3. Create a link to launch the modal window.

<a href="#content">Basic modal</a>

4. For AJAX modal, you just need to create a link pointing to the external resource like this:

<a href="content.html">AJAX Modal</a>

5. Call the plugin on the trigger link.

$('a').overthrow();

6. Available options & callbacks.

$('a').overthrow({

  // A class that will be added to the overthrow wrapper. 
  customClass: 'myclass',

  // called once the content is added to the overthrow
  afterLoad: function(){
    alert('hello!');
  }
  
});

Change log:

2016-07-18

• Add CSS transitions for close button and cleanup existing transitions

2015-07-28

• Fix issues for IE9 and transition detection/application

---

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