In this section, we will learn what the animation-play-state property is and how to use it in CSS.
CSS animation-play-state Property Definition and Usage
CSS provided a property named `animation-play-state` by which we can control whether to stop an animation that is playing or let it play.
CSS animation-play-state Property Syntax
CSS animation-play-state Property Value
The values set for this property are:
- running: this is the default value and when used, the target animation will play.
- paused: using this value, we can stop an element from playing. It actually stops the animation right where it is and the next time we hit the animation to play, it will start its progress right where it was.
Example: animation-play-state property in CSS
How Does CSS animation-play-state Property Work?