DEV Community πŸ‘©β€πŸ’»πŸ‘¨β€πŸ’»

DEV Community πŸ‘©β€πŸ’»πŸ‘¨β€πŸ’» is a community of 963,274 amazing developers

We're a place where coders share, stay up-to-date and grow their careers.

Create account Log in
Saba Alikhani
Saba Alikhani

Posted on

Modal Overlay in pure JavaScript

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

Top comments (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.

🀯

"I made 10x faster JSON.stringify() functions, even type safe"

☝️ Must read for JS devs