Javascript-форум (https://javascript.ru/forum/)
-   Node.JS (https://javascript.ru/forum/node-js-io-js/)
-   -   фон слоя по времени (https://javascript.ru/forum/node-js-io-js/74725-fon-sloya-po-vremeni.html)

Sergey39 03.08.2018 12:05

фон слоя по времени
 
Здравствуйте!

Как создать слой который будет появляться при загрузке страницы и исчезать после 10 сек.?

начало так
if (document.getElementById(video-background).style.display == 'none')
document.getElementById(video-background).style.display = 'block';
else
document.getElementById(video-background).style.display = 'none';

не работает

Audaxviator 03.08.2018 12:07

video-background в кавычки

Sergey39 03.08.2018 12:16

не работает

Nexus 03.08.2018 12:21

<div>Content</div>
<div id="overlay">Overlay</div>
<style>
#overlay{
	display:none;
	position:fixed;
	top:0;
	right:0;
	bottom:0;
	left:0;
	margin:auto;
	background:rgba(255,255,255,.5);
	padding:30px;
}
#overlay.open{
	display:block;
}
</style>
<script>
(function(){
	const overlay=document.getElementById('overlay');
	overlay.classList.add('open');
	setTimeout(()=>overlay.classList.remove('open'),10*1000);
})();
</script>

Sergey39 03.08.2018 12:32

не работает что не так

<script type="text/javascript" >
(function(){
const videobackground=document.getElementById('videoback ground');
videobackground.classList.add('open');
setTimeout(()=>videobackground.classList.remove('o pen'),10*1000);
});
</script>

#videobackground {
display:none;
}
#videobackground.open{
display:block;
}

<div id="videobackground" class="video-background">
</div>

Nexus 03.08.2018 12:41

Sergey39,
document.addEventListener('DOMContentLoaded',function(){
    const overlay=document.getElementById('overlay');
    overlay.classList.add('open');
    setTimeout(()=>overlay.classList.remove('open'),10*1000);
});

Sergey39 03.08.2018 13:14

так работает, спасибо!

Sergey39 03.08.2018 13:16

плавное закрытие возможно?

Nexus 03.08.2018 13:17

Sergey39, возможно.

Sergey39 03.08.2018 13:21

как?)


Часовой пояс GMT +3, время: 23:48.