Transformations and
Animations
Review

What are the two parts needed to make a transition?

The transition property needs to be declared, and there needs to be a change in the element's properties.

What are 2 differences between transitions and animations?

Animations can have more steps, can change direction, and can loop. Transitions only have a start and end. Transitions also are triggered by something, while animations start themselves.

What does transition-delay do?

It changes when the transition begins.

What are the two main pieces for an animation? Hover over the line to reveal the answer.

The directions for the animation, and telling the element it will perform an animation.

What are the two ways to dictate what happens in certain points of an animation?

Using the from and to keywords, as well as putting percentages to show at what point in the animation things will take place.

What does animation-reverse due to an animation?

It plays it's steps from last to first.

What is the difference between ease and linear in transition timing? Hover over the line to reveal answer.

In linear the speed remains constant, while in ease the transition will start slow, get fast in the middle, and then slow down again.

What is the name of the at-rule used in animations? Hover under the div and keep your cursor on the answer.

@keyframes