Intermediate
A menu icon with a name
The menu button works with a mouse but has no name and no state. Give it the name Menu, hide the picture from screen readers, and toggle aria-expanded on click so the bars become a cross.
With reduced motion the cross must appear at once.
What Check tests
- The button has a name
- The picture is hidden from screen readers
- A click opens it and the top bar turns 45 degrees
- With reduced motion the cross appears at once
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.