The animation CSS property is a shorthand property for animation-name, animation-duration, animation-timing-function, animation-delay, animation-iteration-count, animation-direction, animation-fill-mode and animation-play-state.

CSS CSS Animations CSS Property Experimental Reference

The animation-delay CSS property specifies when the animation should start. This lets the animation sequence begin some time after it's applied to an element.

CSS CSS Animations CSS Property Experimental Reference

The animation-direction CSS property indicates whether the animation should play in reverse on alternate cycles.

CSS CSS Animations CSS Property Experimental Reference

The animation-duration CSS property specifies the length of time that an animation should take to complete one cycle.

CSS CSS Animations CSS Property Experimental Reference

The animation-iteration-count CSS property defines the number of times an animation cycle should be played before stopping.

CSS CSS Animations CSS Property Experimental Reference

The animation-name CSS property specifies a list of animations that should be applied to the selected element. Each name indicates a @keyframes at-rule that defines the property values for the animation sequence.

CSS CSS Animations CSS Property Experimental Reference

CSS CSS Animations CSS Property Experimental Reference

CSS CSS Animations Experimental Overview Reference

Advanced CSS CSS Animations Example Experimental Guide

The CSSKeyframeRule interface describes an object representing a set of style for a given keyframe. It corresponds to the contains of a single keyframe of a @keyframes at-rule. It implements the CSSRule interface with a type value of 8 (CSSRule.KEYFRAME_RULE).

API CSS Animations CSSOM Experimental Interface Reference

The CSSKeyframesRule interface describes an object representing a complete set of keyframes for a CSS animation. It corresponds to the contains of a whole @keyframes at-rule. It implements the CSSRule interface with a type value of 7 (CSSRule.KEYFRAMES_RULE).

API CSS Animations CSSOM Experimental Interface Reference

The animation-fill-mode CSS property specifies how a CSS animation should apply styles to its target before and after it is executing.

CSS CSS Animations CSS Property Experimental NeedsMobileBrowserCompatibility Reference

The animation-play-state CSS property determines whether an animation is running or paused. This can be queried to determine whether or not the animation is currently running. In addition, its value can be set to pause and resume playback of an animation.

CSS CSS Animations CSS Property Experimental NeedsMobileBrowserCompatibility Reference