Modal Open/Close with ESC
JavaScript
Medium
4 views
Problem Description
You have #open button and a modal #modal with a close button #close. On open show modal (add class show). On close/ESC click hide it (remove class show).
Output Format
No output (DOM change).
Constraints
Assume #open #modal #close exist. Modal visible when it has class show.
Official Solution
const open=document.getElementById('open');const modal=document.getElementById('modal');const close=document.getElementById('close');const show=()=>modal.classList.add('show');const hide=()=>modal.classList.remove('show');open.addEventListener('click',show);close.addEventListener('click',hide);document.addEventListener('keydown',e=>{if(e.key==='Escape')hide();});modal.addEventListener('click',e=>{if(e.target===modal)hide();});
Solutions (0)
No solutions submitted yet. Be the first!
No comments yet. Start the discussion!