Показать сообщение отдельно
  #6 (permalink)  
Старый 24.01.2020, 17:46
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,109

laimas,
может так?
<!DOCTYPE html>
<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
.window:before {
    background-image: url(http://placekitten.com/1200/900);

}
.window:after {
    background-image: url(http://placekitten.com/1000/750);

}
    .window
{
    width: 400px;
    height: 300px;
    position: relative;
    border: 1px solid green;


}

.window:after,  .window:before{
    content: "";
    position: absolute;
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    background-size: cover;
    opacity: .85;
    transition: opacity 0.4s ease-in;
}






  </style>

</head>
<body>
<div class="window" ></div>
<script>
window.setTimeout(function() {
document.styleSheets[0].insertRule('.window::after{opacity: 0}', 4);
}, 1000)


</script>
</body>
</html>
Ответить с цитированием