How to make anchors work with a vertical navbar?

Publishing help General
1

Link to a section works well, as the section scrolls until it reaches the Navbar element, if you kept Webflows’ default structure and elements.

So when you set up a side navbar, the targeted section scrolls until it reaches the navbar, so the smooth scroll stops when the navbar begins, at the lower edge of the screen, outside the viewport.

http://vincent.polenordstudio.fr/snap/4r3jc.jpg

Any suggestion to make this work with the targeted section reaching the top of the viewport without hacking too much (faking the target) or breaking my Navbar element?

@cyberdave any hope on this before I move on to a custom navbar element?

Thanks in advance.

2

Hi @vincent, thanks do you have a read-only link to share?

3

Yes I was making that.

Demo: Vertical menu with anchors
Public: Webflow - My Sandbox page “Vertical menu with anchors”

You can see how I hacked my way into it previously, using the navbar element as a dummy element stuck to the top of the viewport to trick the sections, here: http://sab.webflow.io/vertical-2-levels-accordion-menu

4

Hi @vincent, thanks for the additional detail :slight_smile: I took a look, and the solution would be to put your navbar in it’s own section that is set to fixed, and set with a type of Nav.

Then select the first section that will be the “home” section apart from the nav, and set that section to type Header.

Finally, select the Navbar and select the “Disable scroll offset when fixed” checkbox on the settings panel.

:slight_smile: Cheers, Dave