停止CSS动画

Question

我有下面的代码，它将鼠标悬停在容器div上时动画图像类。但是，如果图像是中等动画，并且用户停止悬停，则动画会暂停 - 这看起来有点奇怪。

有没有办法停止或恢复CSS动画到其静态？

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

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

Answer 1

在动画播放之前获取图像的截图也许吗？ .image1 background-image：“yourimage” } ＃容器：悬停.image {0}动画播放状态：正在运行; }

并将image1设置为您的静态图像，并保持您的悬停为动画。这不是一个失败的证据，但应该在理论上工作。