I have a single-page website with several sections, each one is 100VH so it takes the whole screen. I also have a fixed navigation on the top.
I want to change navigation background when a specific section is being shown. I’ve tried using Interactions (Scroll Into View), but it seems that when scrolling through the page, all triggers are fired only once. That is, scrolling back and forth changes the background color once.
Yeah @shpoont, I see what you’re working with. Yes that scroll into works once on “Into View”, but you don’t have an “Out of view”. That would allow a color change.
Sorry, I didn’t explain it properly. Consider 4 sections - red, green, blue and yellow. Since blue is surrounded by two different colors, it’s impossible to use “Out of View”, because it should work differently depending on scroll direction.
Ah I see, it’s a little confusing, but I think I’m with ya. So in that case, Blue would get it’s own interaction to change by itself. It will activate at the same time as the others, but they would be independent. Just layer interactions.
Do all the normal ones, except blue. Then you can see your options (me as well). Go ahead and start with the colors.
But I understand you’re dilemma, I’m 100% confident there’s a way to do this. But I can only see you’re site, I can’t see your mind…
I know this is a pretty late answer but if anyone come to this thread the solution is to add a dummy animation on “scrolled out of view” (ex set opacity to 100%)