Click on "Choose a map"

Hi everyone, I have a normal "Choose a map" button. I wanna make it so that when clicking on it - two pictures pops out and you can then press on one of them. Right now im only use HTML and CSS. I wanna keep is a simple as possible. I dont need a tutorial, just a little guidance on where to look πŸ™‚
5 Replies
Wolle
Wolleβ€’16mo ago
If you want to keep it without JS, you can use a checkbox and use the :checked pseudo-class to show/hide your popup. A better solution, in my eyes, would be to use JS on the button to show/hide a dialog element. https://developer.mozilla.org/en-US/docs/Web/HTML/Element/dialog
Gv3-Flyver
Gv3-FlyverOPβ€’16mo ago
Hey @daswolle I dont mind JS, Im just not as strong in it. And is it possible to insert pictures in the dialog element?
Wolle
Wolleβ€’16mo ago
Only one way to find out ^.^
Wolle
Wolleβ€’16mo ago
(Ok, more like three) Heres Kevins video about <dialog>: https://www.youtube.com/watch?v=TAB_v6yBXIE
Kevin Powell
YouTube
dialog = the easiest way to make a popup modal
Ever needed to make a modal? Well, we have a native HTML element that does the job with the dialog element! It does a lot of things out of the box that are really awesome, so let’s see how it works! πŸ”— Links βœ… Codepen: https://codepen.io/kevinpowell/pen/KKyOYvM βœ… The polyfill: https://github.com/GoogleChrome/dialog-polyfill βœ… a11y modal: htt...
Gv3-Flyver
Gv3-FlyverOPβ€’16mo ago
thanks Wolle πŸ™‚ I will have a look that it πŸ™‚
Want results from more Discord servers?
Add your server