Hi, I wonder if there a way to highlight active links on scrolling down the web page. But I need a way without jquery or vanilla(pure javascript) …thanks in advance
What do you mean by “active links”? So far I had always thought that links are “active” while they are being clicked … active while scrolling sounds contradictory to me. Maybe you could elaborate on that or post an example.
I really doubt it is possible without JavaScript. Normally is solved using Intersection Observer: https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API
2 Likes
This seems like you are making a single page layout. Some simple JS could do the trick, simply by checking for amount of scroll (if I can call it like that). Check out any video or article on sticky navbar and apply the same technique, just add/remove class which specifies the desired looks. This required a bit of trial and error though to get things right though.
what am looking for is a method so that when I scroll down to a specific section on my webpage ,the link in my navigation that is related to this section becomes highlighted
Ok I’ll checkout ,thanks
I see. If you meant without any JS here is something based on css :hover
Otherwise, you could try searching for “scrollspy vanilla js”