Design comparison
Solution retrospective
Accessbility is stressing me out so much. Any advice how to go about it so it's less stressful? Thanks
Community feedback
- @akpekigPosted over 1 year ago
That much styling should not be controlled in JS. Use media queries and classes to toggle the menu and determine when it's shown. Then use JS to write functions toggling the ARIA attributes. ARIA will become a lot easier. Instead of counters and conditionals based on remainders, just use booleans. Much easier to toggle and you can use the state of a boolean variable as the ARIA attribute's value. Finally, selecting all of the targeted elements at the same time instead of just one and then looping through them will greatly reduce the amount of code you have to write.
var menuDisplay = false ... element.attr(ariaAttribute, menuDisplay)
Resources:
Marked as helpful0 - @cmb347827Posted over 1 year ago
I did use media queries that determined when the menu is shown in mobile , from line 242 in the scss file. But the code you posted above would have been a neater solution to what I did.
I liked to seperate my code (add eventlistener one at a time) as I did as I think it's more readable maybe .
0
Please log in to post a comment
Log in with GitHubJoin our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord