Home

wtc-modal-view 1.2.4

A simple, unopinionated modal class.

src/wtc-modal-view.js

new Modal()

A Modal class which can display programatically-generated content, or pull in content from an existing DOM node.

Returns
  • Void

Modal.constructor()

Creates base DOM element.

Examples
const Modal = new Modal();
Returns
  • Class The Modal instance

Modal.close()

Closes modal, removes content and optional class, and shifts user focus back to triggering element, if specified.

Returns
  • Class Modal instance.

open(content, optionalClass[, focusOnClose])

Opens modal, adds content and optional CSS class

Parameters
Name Type Description
content string HTMLElement - String or DOMNode to be added as the modal content.  
optionalClass string - Optional CSS class to add to the modal element.  
focusOnClose HTMLElement - Element which will receive focus after the modal is closed. Typically, this will be the element which triggered the modal in the first place. Optional
Examples
const triggerButton = document.querySelector('trigger');
const testContent = '<p>Some sample content!</p>';

triggerButton.addEventListener('click', () => {
  // Passing `this` as the third argument sets our trigger as the focused item once the Modal closes.
  Modal.open(testContent, 'test-modal-class', this);
});
Returns
  • Class Modal instance

focusFirstElement()

Shifts focus to the very beginning of the modal element—just before the close button.

Returns
  • Void

Documentation generated with doxdox.