README
dom-modal
Standalone modal for the browser.
- CSS centered
- No width or height needed. But it works if you provide them
- Overlay included
- Overlay click closes the modal
- Esc key closes the modal
- No external dependencies, all-in-one JavaScript file
- ~3.5K minified gzipped
- Easy to style
- Works on IE9+
npm install dom-modal --save
usage
var modal = require('dom-modal');
var content = document.createElement('div');
content.innerHTML = "Hello modal";
var myModal = modal(content);
myModal.show();
myModal.hide();
myModal.on('show', console.log);
myModal.on('hide', console.log);
test
npm test
example
npm run example
Then open http://0.0.0.0:8080/example.html in a browser.
styling
See the css files: overlay.css, modal.css.
Just overwrite the styles you want.
credits
CSS techniques by:
- Sara Soueidan: http://tympanus.net/codrops/2013/11/07/css-overlay-techniques/
- Scott O'Hara: http://www.smashingmagazine.com/2014/09/15/making-modal-windows-better-for-everyone/
And modified by me for IE11.