Using avgrund.js does not trigger the box mapping which is specified in the template: $ ('. Box'). The box has "display: none;" as stated in the documentation. The console is silent with errors.
<script src="js/jquery-1.12.4.js"></script> <script src="js/jquery.avgrund.js"></script> <script> $('#element').avgrund({ width: 640, // max is 640px height: 350, // max is 350px showClose: true, // 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: 'element', // lets you name custom class for popin holder.. overlayClass: 'elementOverlay', // ..and overlay block enableStackAnimation: true, // enables different type of popin's animation onBlurContainer: '', openOnEvent: true, // set to 'false' to init on load setEvent: 'click', // use your event like 'mouseover', 'touchmove', etc. template: $('.box') }); </script> <link href="css/avgrund.css" rel="stylesheet"> <a href="#" id="element"> Lorem ipsum </a> <div class="box" style="display: none;"> Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quas, rem. </div>