💧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, duration hours minute second in high quality that is uploaded to the channel Bedimcode 09 April 2022. Share the link to the video on social media so that your subscribers and friends will also watch this video. This video clip has been viewed 43,282 times and liked it 1.3 thousand visitors.