Ihmodals NPM | npm.io

IHModals

IHModals is a lightweight, simple, accessible and tested framework for creating modals. The library has no dependencies and provides its codes unbundled sass and es6 or as bundled css and javascript.

Demo

Demo can be checked Here

Usage

Include javascript and styling. Javascript can be included by importing

import IHModals from "ihmodals";

or by including the built bundle

<script src="/dist/ihmodals.min.js" type="application/javascript"></script>

The styling can be included with sass

@import "~ihmodals/dist/ihmodals.scss";

The styles can be customized with variables that can be overwritten. Variables can be checked here.

Built css is also included.

<link href="dist/ihmodals.css" rel="stylesheet">

After including the library modal can be initialized with IHModals class.

const modal = new IHModals(element);

where element is the element you want to turn into a modal, for example

<div class="modal" role="dialog" aria-modal="true" aria-labelledby="modal-title" aria-describedby="modal-description">

    <h2 id="modal-title">Test</h2>
    <p id="modal-description">This is a test modal.</p>
</div>

Modal provides necessary methods to open and close modals. Check the detailed api here.