css3动画暂停

该文章由 leevare 发布于 ,归类于 HTML/CSS

当css3动画被中断时,此时的动画效果会立即恢复到原状,但是有时候并不想立即恢复原状,想保持当前中断时的状态,可以使用animation-play-state:paused.

语法

animation-play-state: paused|running;

说明

描述
paused规定动画已暂停。
running规定动画正在播放。

示例

以鼠标移入暂停,移出继续动画为例

div {
    width: 100px;
    height: 100px;
    background: orange;
}
div:hover {
    animation-play-state: paused;
    -webkit-animation-play-state: paused;
}

如果觉得我的文章对您有用,请您随意打赏。您的支持将鼓励我更加努力创作!

相关文章:

说点什么

avatar
300
  Subscribe  
提醒