Увеличение фона в анимации - PullRequest
Новая
       8

Увеличение фона в анимации

0 голосов
/ 20 мая 2018

Я пытаюсь увеличить анимацию для фонового изображения на определенную секунду.это происходит, но он сбрасывается снова.

я создал образец ссылки в jsfiddle: https://jsfiddle.net/onlinesolution/tk6rcLdx/

что мне здесь не хватает? 

body:before{
  content:"";
  position:absolute;
  top:0px;
  left:0px;
  height: 100vh;
   width: 100%;
    background-image: url("http://paulmason.name/media/demos/full-screen-background-image/background.jpg");
    background-position:center center;
    background-size: 100% 100%;
    background-repeat: no-repeat;
     z-index: -9;
    -webkit-animation: zoomin 5s ease-in;
    animation: zoomin 5s ease-in;
        }

/* Zoom in Keyframes */
@-webkit-keyframes zoomin {
  0% {transform: scale(1);}
  100% {transform: scale(1.5);}
}
@keyframes zoomin {
  0% {transform: scale(1);}
  100% {transform: scale(1.5);}
} /*End of Zoom in Keyframes */

1 Ответ

0 голосов
/ 20 мая 2018

Вам не хватает простого свойства: animation-fill-mode: forwards

Вот ваш код с добавленным свойством, вы увидите, что он отлично работает

https://codepen.io/manAbl/pen/vjbgYK

Далеечтение:

https://devdocs.io/css/animation-fill-mode

...