This project is part of the The Complete JavaScript Course 2022: From Zero to Expert! course.
In this project, the HTML and CSS files were already given. The goal was to teach and understand the fundamentals of query selectors, EventListeners, class lists, Events and handling key presses.
On page load, the necessary UI elements are stored for further and easier access. Using "querySelectorAll" to fetch all buttons with the "show-modal" class, to assign an EventListener. To close the modal window, the user has three choices:
Corrected with https://www.corrector.co/
- click the close button within the modal window
- click outside the modal window (within the page on the darker overlay background)
- click the "Escape" button on the keyboard