Вывод информации через div
Ребят такой вопрос, допустим произошло какое-то событие (например кликнули по кнопке). Как с помощью div на весь экран вывести какую-то информацию? И как потом убрать эту информацию до повторного нажатия без перезагрузки страницы?
|
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style>
div{
display: none;
background-color: #000;
position: absolute;
width: 100%;
height: 100%;
color: red;
top:0;
}
</style>
</head>
<body>
Далеко-далеко за словесными горами в стране, гласных и согласных живут рыбные тексты. Там послушавшись парадигматическая эта наш подзаголовок точках букв предложения, буквоград безорфографичный семантика всемогущая, семь вершину языком пояс имеет на берегу грустный.
<button>Кнопка</button>
<div>ИНФОРМАЦИЯ</div>
<script>
document.querySelector('button').onclick = e => {
var div = document.querySelector('div');
div.style.display = 'block';
setTimeout(()=>div.style.display = 'none', 2000);
};
</script>
</body>
</html>
|
| Часовой пояс GMT +3, время: 03:12. |