Question

css3动画设置什么时候暂停，用animation-play-state:paused如何设置？

动画运动到一半我停止了，但是动画是直接回到初始状态，没有暂停的效果，求解？

Answer 1

没有在某一帧暂停这一属性
不过可以通过将动画拆分来实现
<style>
@keyframes rainbow_1{
0% { background: #c00; }
100% { background: #orange; }
}
@keyframes rainbow_2{
0% { background: #orange; }
100% { background: #yellowgreen; }
}
.demo{animation:rainbow_1 1s forwards}
.rainbow_2{animation:rainbow_2 1s forwards}
</style>
<script>

$(".demo").on(“animationend”，function(){
//然后通过监测动画结束事件 来实现你接下来想做的事情
//比如:
$(this).addClass("rainbow_2"); //播放动画2

});
</script>