Web Animation · Exercise 1 of 4Next
Beginner
Fade and lift the card
The card appears at once when you press Show. Make it fade in and rise 20 px from below over 0.4 s with a tween (no spring).
What Check tests
- Early on it is part-way transparent
- It rises from below
- It is a tween of 400 ms, not a spring
- It ends in place and fully visible
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.