Command Palette

Search for a command to run...

Hectal
Phase 1: How Motion Works
Web Animation · Exercise 3 of 4 PreviousNext
Beginner

Spinner only when late

A fast request takes 100 ms and a slow one 900 ms. The starter shows the spinner immediately for both, so a fast answer makes it flash.

Show the spinner only if the request takes longer than 200 ms, and hide it when the request ends. The status must say "Done" at the end.

What Check tests

  1. A fast request never shows the spinner
  2. A slow request shows no spinner before 200 ms
  3. A slow request shows the spinner after 200 ms
  4. When the slow request ends, the spinner is hidden and the status says Done

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.