Всплывающие окна в JS
Источник: Stack Overflow на русском
как сделать всплывающее окно как в MyStat
Предложу такой демонстрационный пример...
document.querySelector('button').addEventListener('click', _ => {
const os = document.querySelector('#shadow')
os.style.display = 'block'
const om = document.querySelector('#message')
om.style.display = 'block'
os.addEventListener('click', _ => {
os.style.display = 'none'
om.style.display = 'none'
}, {once: true})
})
#shadow {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: #000;
opacity: 0.3;
display: none;
}
#message {
position: fixed;
top: 40px;
left: 10%;
right: 10%;
background: #fff;
border-radius: 5px;
padding: 10px;
display: none;
}
<button>Test</button>
<div id='shadow'></div>
<div id='message'>
<p>как сделать всплывающее окно как в MyStat, компьютерная академия шаг, пример прикреплю снизу</p>
</div>