CSS3 animation-play-state Property

Example

Pause an animation:

______________________________________________________________________________

animation-play-state:paused;
-moz-animation-play-state:paused; /* Firefox*/
-webkit-animation-play-state:paused; /* Safari and Chrome */

______________________________________________________________________________

Try it yourself »

---

Browser Support

The animation-play-state property is not supported in any of the major browsers.

Firefox supports an alternative, the -moz-animation-play-state property.

Safari and Chrome support an alternative, the -webkit-animation-play-state property.

---

Definition and Usage

The animation-play-state property specifies whether the animation is running or paused.

Note: Use this property in a JavaScript to pause an animation in the middle of a cycle.

Default value:	running
Inherited:	no
Version:	CSS3
JavaScript syntax:	object.style.animationPlayState="paused"

---

Syntax

____________________________________________________

animation-play-state: paused|running;

______________________________________________________________________________

Value	Description	Play it
paused	Specifies that the animation is paused	Play it »
running	Specifies that the animation is running	Play it »

Posted in: Animation-play-state,Blog,CSS