A hamburger menu is a classic UI feature present in countless websites. It's used to show and hide a menu on click, especially used in mobile desig...
For further actions, you may consider blocking this person and/or reporting abuse
nice article,merci
Thx Stud 😄, glad u like it!
Hey! I can't get it working and I'm not really sure why.
The CSS properties are successfully being toggled because the button switches images correctly, and the event listeners are set up correctly because if I put a
console.logstatement in them that also works.Does anybody know why?
I had the same problem.
I'm really not sure why. Tutorial is pretty straight forward.
My solution was creating new class with translateY(-100%) and transition property and adding it on .menu and toggle it in js.
I really wish someone replied to you sooner because I lost so much time 🤣
Thanks,
I want to create navigation drawer like dev.to's
Because when I click outside of the drawer it disappears.
Can anyone suggest me any solution.
Thanks for reading Ahmadullah!! I've recreated this ham menu to make it similar to dev.to's.
codepen.io/ljc-dev/pen/zYoqbrN
Thanks a lot.
I was searching for this solution but I couldn't find it.
if you have any problem then let me know.
Thanks.
U're welcome and thx for the offer 😉. I'm currently getting ready to start freelancing. Building projects and going to re design my portfolio 👌.
testing bug with
inline code.Edit: Could not reproduce...
Hey Lathryx, thx for checking my tutorial. I tried my best, but it isn't perfect 😄. If u want explanations on sth, u can find me on twitter 👌.
Or ask here. But I meant I'm more present on twitter.
great article man, I appreciated it a lot
Thx a lot Andres, glad u found it useful 😁!!
Any ideas on how to disable the menu from appearing out by default when navigating back to the page?
Hello Brian, sorry about that delay. I've tried adding an about page and going to and back, the menu didn't stay open 🤔. If you are still having this trouble, I could have a look at your code 👌.
Thanks for the article! Saved me on a project that I was doing on my own a little ahead of my current knowledge. A quick note: I ended up using .replace instead of .add/.remove -- a little cleaner and particularly handy for wiping any CSS styles that you might want to completely hide/show when you trigger the toggle.
Thanks again! Huge help!
Thanks for this. I just removed jquery and used the javascript to animate my hamburger icon. Sweet.
You're welcome 😀!
Thanks this was just what I was looking for! Great description 👍
Glad it was of help Emma 😃!! I still found it lacking and rewrote it once again 😂.
amazing
Great work!
It was really fun doing this tutorial, and thanks for great step by step explanation 🤠