Streaming live at 10am (PST)

Anchor link (selection & color change) interactions-help!

#1

Hi,

I have a anchor-link navigation in fixed-position on right-side.

When you scroll to a particular section, I want the relevant anchor-link button to change color.

I am getting very confused with interactions. I don’t know if I should use Element trigger (scroll into view) or Page trigger (page scrolled) or something else?

Should I choose Affect: selected element or class?

I tried many times, it doesn’t seem to work.
Please help!

Share-link is below. Please go to “Test Page” (at bottom of static page list).
Thank you.


Here is my public share link: https://preview.webflow.com/preview/online-lubricants?utm_source=online-lubricants&preview=6dca0a97f74a0f3c3b895cc5482f05b5
(how to access public share link)

#3

Hi @RohanGanachari,

You are almost there :slight_smile:
All you need to add, is a current state to your anchor link with the red background and white font color.

#4

@avivtech I tried doing that, but its not working.

When I scroll up to the 1st section, both anchor links change color.

When I scroll to the 2nd section, none of them change color.

I’m surely missing something here. But I don’t know what!?

#5

That is only because you still have interactions on them. You don’t need any interactions to create this behaviour.
Once you remove the “scroll into view” interactions from the div wrapping the text, all will work great :slight_smile:

#6

:hushed: I didn’t know interactions wasn’t required here.

I feel so stupid now! :joy: