动画控制

目前可以通过实验中的功能 animation-play-state 来控制动画状态。

一、概述

animation-play-state CSS 属性定义一个动画是否运行或者暂停。可以通过查询它来确定动画是否正在运行。另外，它的值可以被设置为暂停和恢复的动画的重放。

二、语法

/* Single animation */
animation-play-state: running;
animation-play-state: paused;

/* Multiple animations */
animation-play-state: paused, running, running;

/* Global values */
animation-play-state: inherit;
animation-play-state: initial;
animation-play-state: unset;

三、参考资料

https://developer.mozilla.org/zh-CN/docs/Web/CSS/animation-play-state