Changing header color to match background

Heya! I’m trying to get my header to match my background as the user scrolls through different sections of the site, and thanks many similar requests on the forums I feel like I’m close. The last steps are just not clicking though. Any help would be appreciated.

I’ve got the color change while scrolling down, but am having trouble when scrolling back up (and down again).


Here is my public share link: LINK
Published site to view current interaction state: LINK

(edits to fix links)

Hello @nfeyma,

What you have to do is to use a “while page is scrolling” interaction on your navbar, that way it is consistent when it scrolls down and up. I hope this helps.

1 Like

Thanks! I can certainly try that out - it seems to work after a quick test. It feels like it might get weird as the page scale changes due to responsive adjustments, but it’s at least working now - a significant improvement over the last couple days.

Edit: I think I see - to account for the responsive layout changes, I’d create separate animations for each breakpoint and use the desktop/tablet/etc checkboxes in trigger settings.

1 Like