I’m trying to achieve a common behavior where the navbar background starts transparent when the page loads, and then a background color is added when the page is even slightly scrolled.
I used an empty div right below the navbar and put a scroll-into-view trigger on it, to replace the background color, which works great.
One problem I encouter is when the page loads and it’s already scrolled - in this case, the animation doesn’t trigger, and I’m left with the original background color and not the one I wanted for this kind of state.
How can this be solved?
Try adding the animation to the page itself under page interactions.
On there you can create a copy of the interaction you have for scroll into view but append it to “While page is scrolling” and set it to 1% of the page. That should cover you, let me know if you got it or if you need some more help