Minimal Static Modal Popup Plugin - jQuery layerPopup

layerPopup is a minimal, Bootstrap compatible Popup plugin for jQuery that allows you to display static web content in a modal dialog with support for background overlay and open/close callbacks. You can close the modal popup by pressing the close button or clicking anywhere on the background overlay. 

How to use it:

1. Insert the jQuery layerPopup's JavaScript jquery.sh-layer-popup.js after the latest jQuery library but before the closing body tag.

<script src="https://code.jquery.com/jquery-3.2.1.min.js" 
        integrity="sha384-xBuQ/xzmlsLoJpyjoggmTEz8OWUFM0/RC5BsqQBDX2v5cMvDHcMakNTNrHIW2I5f" 
        crossorigin="anonymous">
</script>
<script src="jquery.sh-layer-popup.js"></script>

2. Insert your content into the modal popup.

<!-- Basic -->
<div id="dialog">
  Content here
</div>

<!-- With a close link -->
<div id="dialog">
  Content here
  <a href="#" class="dialog-close">Close</a>
</div>

3. Create a trigger element to launch the modal popup when needed.

<button type="button" class="dialog-open">Launch</button>

4. Call the function on the modal container and specify the selectors of launch/close elements. That's it.

$(function() {
  $("#dialog").shLayerPopup({
    open: ".dialog-open",
    close: ".dialog-close"
  });
});

5. The plugin provides two callbacks which will be triggered when the modal popup is opened and closed.

$(function() {
  $("#dialog").shLayerPopup({
    openevent : function() {},
    closeevent : function() {}
  });
});

6. To hide the background overlay on modal open, follow this step:

$(function() {
  $("#dialog").shLayerPopup({
    background: 'none'
  });
});

---

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