Object-Oriented W3 Modal

W3-CSS based modal managed by a JavaScript object.

This library manages a shadow DOM with complete W3 CSS styling inside. It does not affect the styles of anything outside the modal.

Installation and Use

Install this repo as an npm dependency:

npm i object-oriented-w3-modal

Then,

import { W3Modal } from "object-oriented-w3-modal"

Usage

Constructor Argument(s)

An optional init options argument can be passed to the constructor.

Field	Type	Explanation
html	string	The HTML code for the content of the modal
contentElement	HTMLElement	Element node for the content of the modal. Cannot co-exist with html.
header	string	Text to put on the header of the modal
footer	string	Text to put on the bottom of the modal

Instance Methods

Instances have the following self-explanatory methods:

• open()
• close()
• toggle()

Access the .content getter to get access to the content HTML node.