DEV Community

Saba Alikhani
Saba Alikhani

Posted on

Modal Overlay in pure JavaScript

This is a simple modal overlay made with pure js, css, and html.

Discussion (2)

Collapse
oskarcodes profile image
Oskar Codes

The modal is great, but the code isn't really.
You're using a modal and a backdrop global variable, which firstly is bad practice, but also means there cannot be stacked modals on top of each other. You should instead keep the elements inside the context of the function that creates them.
Furthermore, you'd usually not want any complex HTML creation in JavaScript. What you'd ideally want is an HTML template that is shown when the button is clicked. Additionally you can customize the content of the modal using this method, without having to create the modal from scratch in JavaScript.

Collapse
fydsa profile image
Saba Alikhani Author

Thank you very much Oskar :) Very useful.