Animations

Syntax

• transition: <property> <duration> <timing-function> <delay>;
• @keyframes <identifier>
• [ [ from | to | <percentage> ] [, from | to | <percentage> ]* block ]*

Parameters

Transition | | ––––– | —— | Parameter | Details | property | Either the CSS property to transition on, or all, which specifies all transition-able properties. | duration | Transition time, either in seconds or milliseconds. | timing-function | Specifies a function to define how intermediate values for properties are computed. Common values are ease, linear, and step-end. Check out the easing function cheat-sheet for more. | delay | Amount of time, in seconds or milliseconds, to wait before playing the animation. | | |@keyframes | | [ from | to | <percentage> ] | You can either specify a set time with a percentage value, or two percentage values, ie 10%, 20%, for a period of time where the keyframe’s set attributes are set. |block | Any amount of CSS attributes for the keyframe. |