Всем привет. Подскажите как грамотно сделать плавное скрытие картинки gif. Как сделать плавный показ картинки мне понятно, в стилях вот этот код
#rybak {
grid-row: 1;
grid-column: 1 / span 8;
transform: scale(0.8);
position: relative;
margin-top: 6em;
margin-left: -1em;
opacity:0;
transition: 2s;
animation: show 2s 1;
animation-fill-mode: forwards;
animation-delay: 3s;
}
@keyframes show{
0%{
opacity:0;
}
100% {
opacity:1;
}
}
а вот как его так же плавно скрыть через, скажем 10 сек., не получается. Навыки в css минимальные. Нашел JS
setTimeout(function(){
document.getElementById('rybak').style.display = 'none';
}, 1000);
для скрытия картинки, но там скрытие происходит мгновенно, а не плано. Всем спасибо.