How to get Nav bar to condense?

H gang,

I have a Top Banner set as a section, with a separate Navbar beneathe it. I want the top banner to go away with scroll, and the navbar to condense in size. Can anyone offer some assistance?? I’d be highly grateful!

TJ

link:
https://preview.webflow.com/preview/mezzolio?preview=c8ac737007ca46f80c356c430d3ebad5

Try adding this interaction to your section 8!


1 Like

Hmm @parkerwest I must have something wrong. I duplicated what you’d done. Page loads, Navbar quickly snaps to top covering “Top bar” without me touching the trackpad, then does not move down when I scroll up. Thanks for helping me with this

It looks like you have the interaction on the nav bar but it actually needs to be on the first section which you have as section 8. Turn off the interaction for the nav bar and then activate it on section 8 (i’ve circled it in the screen shots). The interaction is based on weather section 8 is in view or not so if section 8 scrolls out of view the nav menu will be affected. Also, you don’t need an initial appearance since the nav bar doesn’t move until after you scroll. Try this out!


1 Like

This is a similar concept to what you have but in reverse! Also, you won’t have to make a new nav bar.

Got it! Thanks so much brother :slight_smile:

1 Like