Lite Modal JavaScript Library – modalite

Category: Javascript , Modal & Popup | July 27, 2017
Views Total:754 views
Official Page:Go to website
Last Update:July 27, 2017


Lite Modal JavaScript Library – modalite


modalite is a simple, lightweight JavaScript library for creating responsive modal windows with CSS3 animations.


npm install modalite

How to use it:

Insert the modalite’s stylesheet in the header of the document.

<link rel="stylesheet" href="modalite.css">

Insert the modalite’s JavaScript at the end of the document.

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

The HTML structure for the modal window.

<div id="modal-demo" class="modal" data-modal>
  <div class="modal-container">
    <div class="modal-close" data-close-modal></div>
    <div class="modal-content">
      <h1>Modal Content</h1>
      <p>More Content Here</p>

Create a trigger element to toggle the modal window.

<p data-open-modal="modal-demo">Trigger Element</p>

You Might Be Interested In:

Leave a Reply