Modal Boxes & Popups Plugin For jQuery - Avgrund Modal

Avgrund Modal is a jQuery Modal Plugin for adding beautiful Modal Boxes & Popups to your website. If you want to close modal, please hit "Esc", click somewhere on the screen or use special button.

How to use it:

1. Include Avgrund CSS to style your modal boxes

<link rel="stylesheet" href="./style/avgrund.css">

2. Markup

<a href="#" id="show">Show it</a>

3. Include both jQuery library and avgrund.js

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
<script src="./js/jquery.avgrund.js"></script> 

4. Call the plugin with options

<script>
$(function() {
$('#show').avgrund({
width: 380, // max is 640px
height: 280, // max is 350px
showClose: false, // switch to 'true' for enabling close button
showCloseText: '', // type your text for close button
closeByEscape: true, // enables closing popup by 'Esc'..
closeByDocument: true, // ..and by clicking document itself
holderClass: '', // lets you name custom class for popin holder..
overlayClass: '', // ..and overlay block
enableStackAnimation: false, // enables different type of popin's animation
onBlurContainer: '', // enables blur filter for specified block
openOnEvent: true, // set to 'false' to init on load
setEvent: 'click', // use your event like 'mouseover', 'touchmove', etc.
onLoad: function (elem) { ... }, // set custom call before popin is inited..
onUnload: function (elem) { ... }, // ..and after it was closed
onClosing: false, 
template: 'Your string content goes here..' // or function (elem) { ... }, or selector $('.content')
});
});
</script>

Change Logs:

v1.3.3 (2015-7-31)

• Added onClosing method

v1.3.2 (2014-3-10)

• add dynamic content load

v1.3.1 (2014-3-09)

• add dynamic content load

v1.2.0 (2013-9-28)

• Added AMD and CommonJS styles support.

v1.1.7 (2013-9-23)

• Added support jQuery selectors in template option. Now you can create element with content inside your app
• Better fix for overlay and long content pages, minor add-ons.

v1.1.5 (2013-6-16)

• fix overlay issue, minor add-ons, version up

v1.1.4 (2013-5-27)

• Few fixes

v1.1.2 (2013-2-26)

• Webkit overlay 'transform/position:fixed/overflow' issue fix

v1.1.0 (2013-2-22)

• A bunch of small but very useful fixes and updates

 

---

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