Intermediate
Fade in and fade out
The card appears and disappears at once, because it is hidden with display: none.
Make it fade in (from @starting-style) and fade out over 300 ms, keeping display: none at the end.
What Check tests
- 100 ms into the exit the card is still there, half faded
- At the end it is display: none
- Showing it again fades it in
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.
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.