Я пытаюсь захватить определенный момент в анимации элементов. Значение. Я хочу, чтобы анимация начала и остановилась в точке X (позволяет начать и остановить вторую 5 из 100-секундной анимации).
Вот мой снимок JSFiddle
@-webkit-keyframes background {
from { background: yellow; }
100% {
background: blue;
}
}
div {
-webkit-animation-name: background;
-webkit-animation-duration: 100s;
-webkit-animation-fill-mode: forwards;
-webkit-animation-delay: -40s;
-webkit-animation-play-state: paused;
}
Это, кажется, отлично работает в Chrome и Firefox, но, похоже, не работает в Safari и IE (нет, правильно?!) Примечание. Я оставил префикс специально для его проверки в Safari.
В отличие от Chrome, кажется, что анимация никогда не запускается в Safari и остается на начальном шаге.
Это известная проблема? Есть ли способ обхода или другой способ реализовать это?
ОБНОВЛЕНИЕ/РАЗЪЯСНЕНИЯ
Мне нужно, чтобы уметь фиксировать конкретную рамку анимации. Откройте мою скрипку в Chrome и поиграйте с атрибутом задержки анимации в моей скрипке (убедитесь, что она осталась отрицательной). Вы увидите, что вы можете поймать 1 конкретный кадр анимации. Это именно то, что мне нужно. Моя проблема в том, что это не работает в Safari.