I have a couple of queries, mainly to do with fixing a sub navbar, but also with my fixed navbar on my home page and also site searches.
Firstly, i am using two navbars on one page, the first one is my main navigation and the second is a sub navigation with information purely to do with the selected page.
The prefect example is the Webflow Forum page, when you scroll down their main bar disappears and then the grey section is fixed once the blue section has gone. That is what i am trying to achieve. Also, how do you add a site search to your site?
Second, when you keep scrolling up on my home page there appears to be a white section that starts to cut off my navbar logo and my links. I know people won’t always be scrolling up to that extent but i would like to stop that happening. Again, this doesn’t happen on the Webflow Forum site so there must be a solution.
We will make interaction with scroll trigger, which will be activated when Navbar (regular one) will scroll out of screen view. Since there is no content right now, I added one more section for make page longer and let Navbar scroll out of view completely.
“Sub nav” make position: fixed and align as you want it to be on the page. Add Transform: move Y: -100% (move up on 100%).
Apply Interaction to Navbar:
Trigger= Scroll, Affect different element: Sub Navbar
Scroll in to view = Transform: move Y: -100%
Scroll out of view = Transform: move to origin