Small & Customizable Modal Dialog JavaScript Library – Nano Modal

Category: Javascript , Modal & Popup | May 19, 2015
Author: kylepaulsen
Views Total: 2,456
Official Page: Go to website
Last Update: May 19, 2015
License: MIT

Preview:

Small & Customizable Modal Dialog JavaScript Library – Nano Modal

Description:

Nano Modal is a small JS library used to create responsive and mobile compatible modal & dialog boxes that are fully customizable via CSS & JavaScript.

Default Usage:

Load the Nano Modal JS library in your document.

<script src="nanomodal.js"></script>

Create a button to trigger a modal box.

<button onclick="openModal1()">Open Modal 1</button>

Display a modal box with a close button.

var modal1 = nanoModal("Test Content");

Expose open function.

window.openModal1 = modal1.show;

Available options.

// var customModal = nanoModal(MESSAGE, OPTIONS);
var customModal = nanoModal("hey", { 

// A string of space separated classes you want on the main modal container
classes: "",

// An array of objects (button definitions) to set the buttons on the bottom of this modal.
buttons: [],

// Make the modal automatically call remove() on itself after it hides.
autoRemove: false,

// Allow a click on the background overlay to close the modal
overlayClose: true

});

You Might Be Interested In:

Leave a Reply