Hi!
Here’s my plan. I am making a sticky navigation bar with a see through background so only the text will be visible. Different sections of my homepage will have different colors. So I would like the nav bar text colors to change (for contrasts sake) when the new section is in full view. How do I create that?
So basically, Hero section is dark, so I want the text to be white… then as you scroll down and the sticky navbar crosses over to the new section with is light colored I need the text to change to a dark color. Hope it makes sense and it feels like it should be so hard… but I’m new at this.
Thank you for reading and hopefully you can help explain this to me.
Here is the link. I still don’t understand how to get the text to change color when it enters the new section. So the trigger is the section, but what is effected is the text color in the nav bar. Appreciate your help man!
Ok, I have taken a look and realized that triggering by sections might cause some problems. It would be best to add a trigger element to each OTHER section at the bottom of it and adding an offset in relation to the section height.
The trigger will activate an interaction that changes the text color of all the .Nav Link class.
I’m sorry but I don’t understand that explanation… I’m pretty new at all this. As far as I understand, I pick and element and than click on Interactions… in there I have only managed to find how to do changes to that element or class, but I can’t find how to pick certain things to trigger that change.
You can prevent the dark text from disappearing to soon before the the dark background enters by adding a little delay to the “Start” point “After Previous Action”.
I hope you don’t mind me hoping onto this thread, I am trying to achieve the above as per @avivtech example that he published, I am struggling to recreate the effect when you scroll back up the page, I wonder if you could maybe shed some light on where i’m going wrong, i’m still pretty new to Interactions in webflow. Cheers
