Responsive Navigation Bar Using HTML CSS & JavaScript | With Dropdown Mega Menu

Responsive Navigation Bar Using HTML CSS & JavaScript. With dropdown mega menu and a beautiful minimalist interface. Developed first with the Mobile First methodology, then for desktop.

🔔 Subscribe for more!

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
🔗 Source code

💎 Membership

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
👨‍💻 Build the project from scratch

👆 Download (empty files)
- Click on the GitHub link
- Click the green button (code)
- Click Download ZIP

📂 Assets

⏱ Timestamps
0:00 Intro Responsive Navigation Bar
2:14 Project Setup
3:26 Variables & Reset CSS
4:48 Header HTML
6:27 Header CSS
10:38 Navbar HTML
13:02 Navbar CSS
16:10 Navbar JS
20:08 Dropdown HTML
29:44 Dropdown CSS
35:06 Dropdown JS
44:32 Breakpoints
56:28 Delete Dropdown Styles
1:01:10 Final Project

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
🔥 Follow me!

☕️ Support me

👍 Thanks for watching!
Make sure to like + Subscribe for more! 💗

#responsivenavbar #navigationmenu #dropdownmenu

[priyamsingh]

I can really put this nav bar in my website I'm building.
Thanks for the video

[yasengo]

Very good one feels better with key sound than background music

[bryanc.]

Que diseño más increíble!. Muy buen tutorial.

[BMikel]

That's a great tutorial. However, in real e-commerce projects there are usually 2nd and 3rd level of navigation. It's a bit tricky to do that. Could you make a tutorial for responsive multi-level mega menu navigation?

[moviemate_]

this is what i wanted and needed thanks a lot buddy 👌👌

[OnlyJavascript]

This stuff is real bomb. Amazing!! can u please show us how to implement the same using tailwindcss and react?

[priyadharsini]

hi i have problem in media query
when i hide close icon my menu also not showing up i dont know what to do

[guruprasadgaikwad]

Can you teach us the process to make such beautiful designs, in order for us to learn ?

[deprice]

I took your code to the letter on the vehicles but it does not work for me. I'm a beginner but I really like your creations and I try to focus on your tutorials but I didn't understand. Even on the design of the residence, it was the same. How should I do to follow you well.

[shashreesamuel]

What font are you using for your code editor?

[lambo-ca]

Could you kindly a Sidebar mega menu with dropdowns?

[moizkhan]

you addded a .show__dropdown class through JS but you never made that class in the css??