@Mauricio_C_G_Pereira Have you taken a look at this tutorial on webflow university? I just used it to reveal a navigation when a user got to a certain part of the page and it works perfectly!
Thank you @sarahdarr.
Yes I saw. And it’s more or like what I want. The difference is that I want the nav bar to hide again when the page reach the top, and in that example the nav bar remains.
@Mauricio_C_G_Pereira Try using the “While page is scrolling” interaction instead of page scrolled interaction. That will help you set animations based on which way the user is scrolling at at what part of the screen they are on. You can set 0% to move the nav on the y axis -100px to hide it at the top.
Thanks @sarahdarr.
Yes, it could be, but that also shows the nav bar when the user scrolls down, and I don’t want that.
basically I want the navbar to show only when the user scrolls up, and when the page reach the top, the navbar hides.
I even tried to move the navbar when the hero div appears, but that also isn’t a solution.
I’m stuck with no ideias
Were you able to find the answer to your question?
I am stuck with the same problem.
My top nav bar has a transparent background.
My sliding nav bar has a black background.
So even if i enter a higher z-index for the top nav-bar, the black one is still visible behind it.
Any answer would be greatly appreciated
Just say to your Nav Bar hide when Header scrolled into view. Directly saying: choose Header → Pick Scroll into view trigger → Create Show/Hide animations and apply them to your Nav Bar
Hi! I’m trying to solve the same problem. I tried @steinebel’s suggestion but it doesn’t seem to work since the Header is already in view on page load. Has anyone figured out a solution to this? Thanks!
The trick is to use two different effects for each trigger. In my example I used the move interaction on the page scrolled trigger and opacity + show/hide on the scroll into view trigger. Add the scroll into view trigger on the top element. (In my case the hero element) When scrolled into view it should hide the nav and when scrolled out of view it should show nav.
Hi, I’m having the same problem. Thank you for your solution @Davidlin_ch12 !
Could you provide a read-only link?
I really wish I could use the same type of animation for both triggers though
I guess I need custom code for that