Name the animation — practice exercise

What you'll be asked to do

1. 1.Name the animationexercise · easy · 10 min

   Attach the spin keyframes to #box.

   Passes when: Attach the spin keyframes to #box.

2. 2.Set the durationexercise · easy · 10 min · practice plan

   Run the animation on #box over 2 seconds.

   Passes when: Run the animation on #box over 2 seconds.

3. 3.Loop foreverexercise · easy · 10 min · practice plan

   Repeat the animation on #box indefinitely.

   Passes when: Repeat the animation on #box indefinitely.

4. 4.Alternate directionexercise · easy · 10 min · practice plan

   Make each repetition run in the opposite direction.

   Passes when: Make each repetition run in the opposite direction.

5. 5.Hold the final frameexercise · medium · 10 min · practice plan

   Keep the end state after the animation finishes.

   Passes when: Keep the end state after the animation finishes.

6. 6.Fix the duration with no unitbug fix · easy · 8 min

   A duration needs s or ms.

   Passes when: A duration needs s or ms.

7. 7.Fix the invalid iteration countbug fix · easy · 8 min · practice plan

   Endless repetition uses the keyword infinite.

   Passes when: Endless repetition uses the keyword infinite.

8. 8.Fix the fill modebug fix · easy · 8 min · practice plan

   The value is forwards, with an s.

   Passes when: The value is forwards, with an s.

9. 9.Fix the direction valuebug fix · easy · 8 min · practice plan

   The value is alternate.

   Passes when: The value is alternate.

10. 10.Fix the name that does not matchbug fix · easy · 8 min · practice plan

    The animation name must match the @keyframes name.

    Passes when: The animation name must match the @keyframes name.

Between them these tasks cover @keyframes, animation-name and duration and Iteration and direction.

Looking for a different chapter? See every practice set, or switch to the interview theory questions.