💧Liquid Navigation Menu Indicator Using HTML CSS & JavaScript

Published: 09 April 2022
on channel: Bedimcode
43,282
1.3k

How to create a responsive liquid navigation menu indicator using HTML CSS and JavaScript. With outer curve effects of magic menu indicator.

❤ Support me
https://www.buymeacoffee.com/bedimcode

💙 Support me by PayPal
https://ko-fi.com/bedimcode

📁 Assets
Fonts: https://fonts.google.com/
Icons: https://remixicon.com/
GitHub: https://github.com/bedimcode/responsi...

🔗 Source code
https://github.com/bedimcode/liquid-n...

☝ How to download the project
Click on the GitHub link
Click the green button (code)
Click Download ZIP
Extract the project to the desired location

👨‍💻 Start project from scratch
https://github.com/bedimcode/liquid-n...

🔔 Subscribe for more!
   / bedimcode  

⏱ Timestamps
0:00 Intro liquid navigation
1:37 Project Setup
2:19 Navbar HTML
4:06 Variables & Reset CSS
06:07 Navbar CSS
09:05 Liquid Navigation Indicator
11:42 Scroll Sections Active Link
14:22 Breakpoints
15:44 Link Active Without Scroll
16:31 Final Project

🎥 Video how to use Sass in projects
   • Settings and how to use Sass | Config...  

👍 Thanks for watching!
Make sure to like + Subscribe For More! ❤

#responsivenavbar #navigationmenu #responsivemenu


Watch video 💧Liquid Navigation Menu Indicator Using HTML CSS & JavaScript online without registration, duration hours minute second in high quality. This video was added by user Bedimcode 09 April 2022, don't forget to share it with your friends and acquaintances, it has been viewed on our site 43,282 once and liked it 1.3 thousand people.