Ouibounce

Ouibounce: A small JS library that allows a user to create modals with custom markup.

Installation

You have a few options to choose from:

• Download the minified script and include it on your page
• Use NPM: npm install easy-modal

Usage

Example:

Modal("<h1>Modal Title</h1>");

Example with dom element:

Modal(document.getElementById("some-id"));

Options

Ouibounce offers a few options, such as:

• Modal CSS class
• Dialog CSS class
• Backdrop CSS class

Modal CSS class

If you want to apply style to the modal root element you use modalClass param. Example:

Modal("<h1>Modal Title</h1>", {modalClass: "modal"});

Dialog CSS class

Example:

ouibounce("<h1>Modal Title</h1>", {dialogClass: "dialog"});

Backdrop CSS class

Example:

ouibounce("<h1>Modal Title</h1>", {backdropClass: "glass"});