Skip to content

Instantly share code, notes, and snippets.

@patmigliaccio
Last active September 9, 2019 23:02
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save patmigliaccio/2cd9b8d021ad8e06d5de25849091d26a to your computer and use it in GitHub Desktop.
Save patmigliaccio/2cd9b8d021ad8e06d5de25849091d26a to your computer and use it in GitHub Desktop.
// Trigger on opening of the modal.
function openModal() {
// Locks the body element from scrolling.
document.body.style.overflow = 'hidden';
// Creates an overlay `div` element.
var overlay = document.createElement('div');
// Adds a `.body-overlay` class to the `div` element.
overlay.classList.add('body-overlay');
// Appends it to the body of the DOM
document.body.appendChild(overlay);
}
// Trigger on closing of the modal.
function closeModal() {
// Query the DOM for the overlay element.
// Note: Could maintain the reference to the variable instead of querying for it.
var overlay = document.querySelector('.body-overlay');
// Check if exists.
if (overlay) {
// Remove from the parent body element.
overlay.parentElement.removeChild(overlay);
}
// Unlocks the body for scrolling.
document.body.style.overflow = null;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment