Basic Inline Content Modal In Vanilla JavaScript – Nicedialog

Nicedialog is a minimal static modal JavaScript library to display any inline element in a popup window with zoom in/out animations.

How to use it:

Load the stylesheet nicedialog.css and JavaScript nicedialog.js in the html file.

<link rel="stylesheet" href="nicedialog.css">
<script src="Dialog.js"></script>

Wrap your modal content into a container with the CSS class of nice-wrapper.

<div class="nice-wrapper">
  Modal Content Here
</div>

Initialize the Nicedialog.

let myDialog = new Dialog();

Show the modal.

myDialog.showModal('.nice-wrapper')

Changelog:

04/25/2020

• v1.0