Join the Webstudio community

Updated 3 months ago

Nav-link's to active as you scroll through sections

At a glance

The community member is asking about how to change the active style of navigation links on a single-page website when scrolling to different sections. They mention that they can add links to each section using <a href="#sectionID">Section Name</a>, but this doesn't change the style of the nav-links to active.

In the comments, another community member responds that to achieve this, the community member would need to use a "scroll spy library".

BBenoît Meunier

You must have seen single page websites which have different sections displaying different information. When you scroll down to every section, the navbar active link changes.

You might know that you can add links to each section in a navbar for single page websites by simply using:

Plain Text

<a href="#sectionID">Section Name</a>

However, this doesn't change the style of the nav-links to active.

I know it's possible to do it in Javascript, but is it possible easily, knowing I'm using

1 comment

JJohn Siciliano

No. Would need a scroll spy library

Add a reply