Приостановка анимации CSS 3 (так сказать) - PullRequest
Новая
       12

Приостановка анимации CSS 3 (так сказать)

1 голос
/ 09 декабря 2011

Мне было интересно, знает ли кто-нибудь о способе приостановить (или настроить скорректировать время события в определенной точке) анимацию CSS3?

Допустим, у меня был отскочивший круг, и я хотел, чтобы ему потребовалось 2 секунды, чтобы достичь его наивысшей точки, и либо приостановить (или поставить длительное время) его наивысшую точку, затем в зависимости отприостановить / заморозить или на длинном промежутке вернуть его в исходное положение.Спасибо за любую помощь заранее.

1 Ответ

1 голос
/ 09 декабря 2011

CSS-анимация Ключевые кадры могут решить вашу проблему. 

.whatever{
     -webkit-animation: bouncepause 10s infinite;
}

@-webkit-keyframes bouncepause {
        0% {
                bottom:0;
        }
        5% {
                bottom:200px;
        }
        95% {
                bottom:200px;
        }
        100% {
                bottom:0;
        }
}

Я включил только -webkit- префиксы поставщиков, чтобы упростить его.

Демо

...