Show & Hide Nav Bar Issue (Can't Seem To Hide Nav On Scroll Up)

Hey Webflow Forum,

I’m currently working on a project where I want the nav system to scroll in and out at a specific trigger point. I have it scroll in at exactly where I want it, but I can’t seem to figure out how to get it back it its initial state (while showing the original transparent nav at the top).

Any help would be appreciated. Please check out my scroll nav interaction past the hero and let me know if anyone has any direction or leads.

Make sure to Toggle Preview when testing.


you are using webflow nav. you can create a new navigation/header by your self.

create a structure like this and apply animation on it
otherwise if you need any help from me contact me here

Thanks for the reply Moheen. But this is not relevant to the question and or direction in which I am building out this site/nav system.

add page trigger animation while page is scrolling. Initially header background color will be transparent. and set header background color white on 20% page scroll