停止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 {     动画播放状态：跑步;     }

将image1设置为静态图像，并将您的悬停设置为动画。这不是失败证明，但应该在理论上有效。