Designer
CMS
Ecommerce
Interactions
Memberships
Editor
Logic
SEO
Hosting
Security
Overview
Libraries
Apps
Hire a Certified Partner
Templates
Made in Webflow
Learn
Community
Ebooks
Forum
Blog
Support
LoginContact Sales
Get started — it's free
Made in Webflow

Section Scroll Progress in Nav

Web Bae's avatar
Web Bae
Clone in Webflow105
site profile thumbnail
Open in Webflow
Open live site
Learn how to create a nav bar with section anchor links that display scroll progress through each individual section. We will leverage GSAP in Webflow with Javascript to recreate this remarkable navbar inspired by balky.studio.
Open in Webflow
Open live site
scrollanimation
gsap
gsapscrolltrigger
gsapanimation
navigation
progressbar
navprogressbar
progress
scrolltrigger
whilescrolling

More sites by Web Bae

See profile
The Greatest Infinite Marquee (HTML + CSS only)
761
7.1k
Moving Gradient Background
587
3.5k
Award Winning Grid Trail Mouse Follow Effect
430
1.2k

Similar sites

author avatar
Scroll progress indicator
71
421
Webflow
author avatar
Progressbar - anchor links - Dynamic Collection
143
890
Egenix - Technology & Marketing Agency
author avatar
Navbar with index and progressbar
143
498
Patrick Urwyler
author avatar
Liquid Nav Anchor Links
206
720
Timothy Ricks
author avatar
Infinite Scaling Smooth Scroll Animation w/ Lenis and GSAP
46
76
Web Bae
author avatar
Circular Scroll Progress Indicator
2
10
Sygnal
Explore
  • Dashboard
  • Marketplace
  • Hire designers
Learn & get help
  • Support
  • University
  • Courses
  • Blog
  • Ebooks
  • Forum
  • Community
  • Developers
  • Wishlist
  • Status
Company
  • About
  • Careers
  • Sitemap
  • Become an Affiliate
Terms & policy
  • Terms of Service
  • Privacy policy
  • Cookie policy
  • Cookie preferences
Social
Social
Explore
  • Dashboard
  • Marketplace
  • Hire designers
Learn & get help
  • Support
  • University
  • Courses
  • Blog
  • Ebooks
  • Forum
  • Community
  • Developers
  • Wishlist
  • Status
Company
  • About
  • Careers
  • Sitemap
  • Become an Affiliate
Terms & policy
  • Terms of Service
  • Privacy policy
  • Cookie policy
  • Cookie preferences
Social
Social