Design comparison
Solution retrospective
Feel like there is a more efficient way to do the JavaScript and CSS, I think there was no reason for the extra IDs, could have just used "getElementsByClassName".
What challenges did you encounter, and how did you overcome them?How to deal with the changing screen size, turns out all I had to do is add a "resize" event listener for the window ¯_(ツ)_/¯
What specific areas of your project would you like help with?Any remarks are welcome!
Community feedback
- @Alex-Archer-IPosted 5 months ago
Hey, another challenge, congrats!
I prefer
querySelector
, seems to me a bit more flexible =)Genuine question: is there some advantages to use js resize vs media queries or you just wanted to practice it?
Marked as helpful1@porumbachanovPosted 5 months ago@Alex-Archer-I In all honesty, it didn't even occur to me to just add a few more classes and use media queries xDD. I wrote the html and css first so when I was writing the js and it came to the resizing problem, I just googled how to do it the js way. Doing it with media queries seems more efficient as it spares an event listener and the js would be cleaner. I knew something was off but don't know what stopped my brain from working xD, thanks for pointing it out!
1@Alex-Archer-IPosted 5 months ago@Vrondir
Oh, I see. Well, it's cool to practice new thing anyway =)
By the way, you skip a couple of semantic tags - the clickable arrow should be a button and the links inside - an
ul
=)And I really like smooth animation of the links pop-up and that they could be closed by clicking anywhere. I tried to figure out how to do it in the another challenge and failed (but there was react app) =)
1
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