You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
A simple, bootstrap-like modal dialog written in pure Javascript.
Installation
$ component install bmcmahen/modal
or use the standalone version in the standalone directory, and attach the script and css to your HTML page.
Use
To use the HTML api, you need to specifically call listen(). The data-modal-id attribute directs us to the id of the modal dialog markup. Use data-modal-close on a button within the modal to close it.
<ahref='#' tabindex='-1' data-show-overlay='true' data-modal-id='myModal'>show modal</a><divid='myModal' class='modal fade' tabindex='-1' aria-labelledby='myModalLabel' role='dialog' aria-hidden='true'><divclass='modal-dialog'><divclass='modal-content'><divclass='modal-header'><buttontype='button' class='close' data-modal-close='true' aria-hidden='true'>×</button><h4class='modal-title' id='myMOdalLabel'>Modal title</h4></div><divclass='modal-body'><h3>header</h3><p> Lorem ipsum Do sit aute minim id et quis amet eiusmod cillum consectetur ad in nisi do sunt consectetur Duis minim deserunt ut et consequat sed ullamco in minim. </p></div><divclass='modal-footer'><ahref='#' data-modal-close='true'>hide modal</a></div></div></div></div>
Or you can use the Javascript API.
varmodal=require('modal');varmyModal=modal(document.querySelector('#myModal'));myModal.show();// show the modalmyModal.hide();// hide the modalmyModal.on('showing',function(){console.log('modal is in the process of showing..');});