Community forum for knowledge and support

Updated last month

A Disappearing Navigation Bar Based on Scroll Direction and Hero Section Background

At a glance

I have a nav bar that I set to show up on scroll up and leave on scroll down.
The nav bar has a background, and 2 of the pages have the same background in the hero section, so I'd like that once the hero section shows up on those 2 pages, even while scrolling up, the nav bar should disappear because the pattern doesn't match up exactly. Is there a way to do that?
@Matt would you know? Thank you very much

M
S
2 comments

@Sara Margolies if you wrapped the navbar component in a div like “navbar_wrapper”, then you could just style the background of that wrapper to be whatever color you want it to be based on the page its on - leveraging CSS.

You’ll need to retarget your interactions to this new navbar_wrapper div.

@Matt DMing you more details to clarify

Add a reply
Sign up and join the conversation on Slack