Streaming live at 10am (PST)

Set where anchor stops on page

#1

I have a sticky menu on my desktop view and links to some anchors on a page. When I click on the link, the heading ends up below the sticky navigation. How can I set where the anchor stops on the page? The section anchor links are on the Guests page of my site.


Here is my site Read-Only: https://preview.webflow.com/preview/gacc?utm_source=gacc&preview=6424d08a78d172753a58551be4151106

#2

In the navbar settings there is a checkbox that says offset sticky nav.

#3

I only see “Disable scroll offset when fixed” and I checked that checkbox but it didn’t make a difference.

#4

Its hard to understand your problem - you talk about this issue (overlap)?

#5

Yes, I want the anchor to stop where it shows the heading. I adjusted the distance for the sticky nav to show some of the text but I’d prefer for all of the nav to show and it to stop where all of the heading shows.

#6

Use relative urls

Out of topic - use relative urls (Not absolute).

Not
https://www.ticketmaster.com/greater-austin-comic-con-tickets/artist/2427387
But
/greater-austin-comic-con-tickets/artist/2427387

Like this all of your links will work also on staging (.io).

#7

Very tricky idea. I hope webflow will add “offset” attribute (Beacuse its really tidy each time to solve this manually).

Related:

Another very not “clean” solution (But will work fine) is to create extra div with offset (And link to this “offset”)


Tutorial her:

Or Try this:

I never try this.

10. The smooth scroll to an anchor link doesn’t stop at the bottom of the navbar

#8

I don’t understand why exactly but I was forced to put the nav bar inside of a div. When I’d set the navbar to sticky it would say that I needed to set the Body to relative position but then the position for body could not be changed. I put the nav bar inside another div and set that div to sticky and it worked. When I turn on the checkbox for offset sticky nav but it doesn’t change anything.