Scroll Offset Interaction Not Working

I’m trying to have a fixed navigation bar that starts transparent over a video and then becomes opaque as it scrolls down the page.

So far, i’ve built 2 navigation bars, one staying transparent and one with the color built in. When I set a Scroll Interaction with an offset, my interaction still loads when the page loads.

How do I get it so the interaction only happens when I scroll partially down the page?


Here is my public share link: LINK
(how to access public share link)

Hi @sarastrese I only see one navigation bar on your site.

However, this old tutorial may help you:

Hi @PixelGeek. There is one navigation bar, but there is a nab_background div positioned behind it.

I tried recreating using your demo, but I still am not successful in loading the page with no background color on the nav and then it appearing upon scroll.

@PixelGeek any ideas about this? It does seem to be something to do with there being fixed positioning. It’s as if the element triggers the interaction upon load and not scroll?

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.