Responsive NavBar with Dropdown | Audio website from scratch using HTML CSS Python and Java Script

In this video we're going to make the NavBar Mobile Responsive. I'll have two separate NavBars, one for desktop and one for mobile devices or smaller screens. And use media queries to change between each NavBar.

The NavBar on small screens or mobile devices will use a check box as a hamburger menu. When checked, a drop down menu will be displayed, and when unchecked, the drop down menu will be hidden.

The sites I build use HTML styled with CSS, and JavaScript for functionally where required. I make my websites from scratch using Visual Studio Code software.
My sites are mobile responsive exploiting Flexbox in the CSS. JavaScript used only when required. Fonts via Google Fonts link.

This video is part of a series. Checkout my other videos:
https://youtube.com/playlist?list=PLZzIfx3OIzSuVk4tBBpegXJ2r8dd6nIE_

▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬
0:00 - Build two NavBars
0:35 - Adding Mobile Menu Check Box
0:54 - Hiding Check Box
1:07 - Position the Mobile Menu
1:18 - Starting the drop down Menu
1:46 - Replacing Check Box with SVG
2:20 - Positioning the Logo
2:55 - Building the drop down Menu
4:01 - Checking Functionality
4:36 - Animating the Mobile Menu
▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬

I independently work on Framework2232 in my free time. If you like show your support, please follow and promote the usual social media.
FOLLOW FRAMEWORK2232:
Website: https://www.framework2232.github.io
Twitter: https://twitter.com/framework2232
Instagram: https://www.instagram.com/framework2232
Pinterest: https://www.pinterest.com.au/framework2232

HTML Headtags: https://www.htmlheadtags.com

Background Music:
When I use background music in my YouTube uploads, I slap the music together myself using LMMS and retain original files. It may not be a top 10 hit but as I made it myself, can't be hit with copyright claim.

#HTML #CSS #JavaScript #Python