CSS Animation

CSS3 animation overview

CSS property animation along with @keyframw definition can be used to implement animation on properties in CSS. The behaviour of these keyframe animations can be read more

CSS animation-name

CSS property animation-name defines a list of animations that apply to an element. Each name is used to select the keyframe at-rule that provides the read more

CSS animation-duration

CSS animation-duration property defines the length of time that an animation takes to complete one cycle. Few points to noe about animation-duration: It cannot be read more

CSS animation-timing-function

CSS animation-timing-function property describes how the animation will progress over one cycle of its duration. e.g. ease, linear, etc. In case animation-name has multiple values, read more

CSS animation-delay

CSS animation-delay property defines when the animation will start. It allows an animation to begin execution some time after it is applied. In case animation-name read more

CSS animation-iteration-count

CSS animation-iteration-count property specifies the number of times an animation cycle is played. It can be a number or infinite. In case animation-name has multiple read more

CSS animation-direction

CSS animation-animation-direction property defines whether or not the animation should play in reverse on some or all cycles. When an animation is played in reverse read more

CSS animation-fill-mode

CSS animation-fill-mode property defines what values are applied by the animation outside its execution time window. These two periods are considered outside animation: During delay read more

CSS animation-play-state

CSS animation-play-state property defines whether the animation is running or paused. When a paused animation is resumed, it restarts from the current value instead of read more

CSS animation shorthand property

CSS animation shorthand property is a comma-separated list of animation definitions, each of which combines animation properties into a single component value. Note that individual read more