CHAPTER 2 ■ CSS3 TRAnSfoRmS And TRAnSiTionS
Table 2-2. Keyword Alternatives to Common Cubic-Bezier Timing Functions
Keyword Graph Cubic-Bezier Description
linear 0, 0, 1, 1 Instant start and stop; constant
velocity through the range of
motion.
ease 0.25, 0.1, 0.25, 1 Swift start, accelerating quickly;
slow transition to stop at end.
As you can see, the angle of rotation changes slowly in the first moments of the eased animation; toward the
middle of the transition, the rate of change increases markedly, reaches a “terminal velocity”, then slows down
until the sequence reaches its conclusion.
There are several keywords that can be used as a shortcut for common transition motions (see Table 2-2).
Figure 2-9. Easing timing function: time on x axis, distance on y axis
(continued)