Остановка анимации CSS

Question

У меня есть следующий код, который анимирует класс изображения во время зависания над контейнером div. Однако, если изображение представляет собой среднюю анимацию, и пользователь перестает зависать, анимация приостанавливается - это выглядит странно.

Есть ли способ остановить или вернуть CSS-анимацию в ее статическое состояние?

.image{ 
    animation-play-state: paused; 
    } 

#container:hover .image{ 
    animation-play-state: running; 
    } 

Answer 1

Получить скриншот изображения перед анимационной игрой, возможно? .image1 { background-image: "yourimage" } #container: hover .image { анимация-play-state: running; }

И установите изображение1 как статическое изображение и сохраните свой зависание как анимированный. Это не доказательство неудачи, но должно работать теоретически.