-webkit-animation-fill-mode в сафари

Question

Я использую ключевые кадры для масштабирования элемента на моей веб-странице.Проблема в том, что анимация отлично работает в Chrome, но не в Safari.Я предоставляю значения в 0%, 80% и 100% в ключевых кадрах, и каждый раз, когда анимация заканчивается, она возвращается к свойствам, определенным в 80%, а не в 100%.я также использовал режим заливки, чтобы остановить анимацию в последнем кадре, но все еще не получил решения.

@-webkit-keyframes leftpageanim { 
0%{ -webkit-transform:scale(1); 
bottom:-26px; 
} 

80%{ 
-webkit-transform:scale(1.8) ; bottom:140px; 
} 

100%
{ 
-webkit-transform:scale(1.7); bottom:120px; } 
} 

после того, как анимация снова вернулась к свойствам 80%

Answer 1

Я сделал некоторые изменения в коде. Посмотрите на это jsfiddle . Анимация теперь останавливается на 100%. Это то, что вы хотели, верно?

от

.animator {
    -webkit-animation-name: leftpageanim;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-timing-function: linear;
    -webkit-animation-duration: 5s;

до:

.animator {
    -webkit-animation: leftpageanim 5.0s ease-in-out forwards;
    -webkit-animation-iteration-count: 1;