CSS3 animation properties

Examples

Use shorthand property animation to bind to a <div> element:

div { animation: mymove 5 s infinite ; - Webkit-animation: mymove 5 s infinite ; / * Safari and Chrome * / }


Browser Support

Figures in the table represent the first browser to support the version number of the property.

Immediately following the digital -webkit-, -ms- or -moz- ago in support of the prefix attribute first browser version number.

属性
animation 43.0
4.0 -webkit-
10.0 16.0
5.0 -moz-
9.0
4.0 -webkit-
30.0
15.0 -webkit-
12.0 -o-

Defaults: none 0 ease 0 1 normal
inherit: no
version: CSS3
JavaScript syntax: object .style.animation = "mymove 5s infinite"


grammar

animation:animation: name duration timing-function delay iteration-count direction fill-mode play-state;;

value Explanation
animation-name Specifies the name to be bound to select the key frames
animation-duration Animation Specifies how many seconds or milliseconds
animation-timing-function How to set up the animation will complete a cycle
animation-delay Animating before starting delay interval.
animation-iteration-count Define the animation plays.
animation-direction Specifies whether to turn back the animation.
animation-fill-mode Provisions when the animation does not play (when the animation is complete, or when there is a delay in the animation does not start playing), to be applied to the style element.
animation-play-state Specifies whether the animation is running or paused.
initial Set the property to its default value. Read the information about initial.
inherit Properties inherited from the parent element. Read the information about initinherital.


related articles

CSS3 tutorial: CSS3 Animation