On scroll down or scroll up or even on click gsap snapping not allowing to add active class to sticky side menu

[chetan9477 0 Likes (Newbie)]

based on the scroll of the section I am adding an active class to the sticky menu by targeting href element through JS but while scrolling to Overview section which is a snapping section based on scroll trigger its not allowed to add an active class in the sticky menu of overview. 

See the Pen by pen?template=oNQNyyV (@pen?template=oNQNyyV) on CodePen

[Rodrigo 5,906 Likes (Superhero)]

Hi,

 

I don't have time to go through all the code you have there and find a way to create a solution for that specific case, but I can advice you to create a simple ScrollTrigger instance for every section. Since the number of sections is the same as the number of sidebar elements, you can easily tap into ScrollTrigger callbacks and update the styles or classes of the sidebar elements.

 

Here is a super simple example of that approach:

See the Pen oNQNrQx by GreenSock (@GreenSock) on CodePen

 

Hopefully this helps.

Happy Tweening!