css - 悬停时播放 CSS 动画，悬停时暂停

Question

我正在努力

• 悬停时播放动画。
• 悬停时暂停动画(即不要返回到第 0 帧)。

难道不能在父 div 上使用 -webkit-animation-play-state: paused; 吗？

查看 example here ，当您悬停时它会回到第 0 帧。

我不想使用 JS。

Answer 1

example jsfiddle

在 #tech 上设置播放状态暂停的动画

#tech {
    -webkit-animation-play-state:paused;
    -webkit-animation: moveSlideshow 10s linear infinite;
}

然后将播放状态更改为悬停运行

#tech:hover{
    -webkit-animation-play-state:running;
}