Command Palette

Search for a command to run...

Hectal
Phase 18: Motion Systems in Production
Web Animation · Exercise 2 of 4 PreviousNext
Intermediate

Seek an animation to a time

Write opacityAt(animation, ms): it jumps the animation to ms and returns the box's opacity as a number.

Leave the animation paused, so the test (not the clock) decides the time.

What Check tests

  1. At 0 ms the opacity is 0
  2. At 100 ms it is 0.5
  3. At 200 ms it is 1
  4. The animation is left paused, so the test decides the time

Stuck? One hint at a time

The solution unlocks after your first Check. Try first: that is where the learning happens.

Runs in your browser. Your code is saved here.

Your page

Press Run to see the page.
00:00.000
animations
0.00s0.10s0.20s0.30s0.40s0.50s0.60s0.70s0.80s0.90s

Nothing is moving yet. Hover, click or scroll the page: every animation it starts shows up here as a track.

frames

Console

Nothing logged yet.