I’m creating a navbar that has a sub navbar with links corresponding to the current page. The main navbar is supposed to be hidden when scrolled out of view, but the sub navbar should remain. The main navbar should become visible again when scrolling it into view.
When scrolling down the page and then up again, an empty space appears that I would like to remove:
I have tried to solve this with page scroll triggers, but I can only offset the main navbar’s height in percentage, which makes it look different depending on the page height.
‘Scroll into view’ ‘Element trigger’ is another alternative, but it causes the animation to start on page load, and therefore it doesn’t work when scrolling down and up again.
Would love to get some feedback on this!
Here is my site Read-Only: https://preview.webflow.com/preview/navbar-link-state?utm_medium=preview_link&utm_source=designer&utm_content=navbar-link-state&preview=cff08338ea89fdad949eb23fceeee3c9&mode=previewly-link