Avgrund Modal – jQuery plugin for modal boxes and popups
Avgrund is a jQuery plugin for modal boxes and popups. It uses interesting concept showing depth between popup and page. It works in all modern browsers and gracefully degrade in those that do not support CSS transitions and transformations (e.g. in IE 6-9 has standard behavior). Tested with jQuery 1.4+, file size is under 2Kb.
DEMO | DOWNLOAD
You can simply init Avgrund with one line and linking ‘avgrund.css’ file:
$('element').avgrund();
Avgrund has several options for you to customize it easily:
$('element').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, // another animation type 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 () { ... }, // set custom call before popin is inited.. onUnload: function () { ... }, // ..and after it was closed template: 'Your content goes here..' // or function() { ... } }); Avgrund plugin was inspired by Hakim's Avgrund.js <a href="https://github.com/hakimel/avgrund/" target="_blank">demo</a>.
