Anchor link scrolls to top, then jumps to correct section

Design help Layout & Design
1

Hi all,

My problem is exactly what the title says—when I click on the final anchor link in my design, the page scrolls all the way to the top before instantly jumping to the section its linked to. Click the “Meet Our Farmers” button at the bottom of the page to see the issue. This issue occurs both in the Designer preview and on the live page.

Most other forum posts about this issue outside of Webflow suggest that an absolute-positioned element can break an anchor link in a similar fashion. I would guess that one of the sizing properties within the “Show Map” interaction is the reason to for the issue, but I’ve not been able to pinpoint what exactly is breaking the anchor link.

Any advice would be greatly appreciated!

Here is my site Read-Only: LINK
Here is my live site: LINK

2

Have you solved it already? On the designer works ok I believe.

designer

3

Interesting—it still doesn’t work properly for me on Safari or Chrome. What browser are you using?

4

Tested it on Brave, Chrome and Safari!

Have you tried refreshing + clean cache? See if that works.

5

Hey @strawpari , so the issue persists for me with the read only link and the reason why is because you have a button behaviour on click which scrolls to section but you also have a Mouse Tap interaction that shows the map.

It’s because of this interaction that makes the site go to the top. Getting rid of the interaction from Meet the farmers button, your scroll to section behaviour works.

6

Hi @imtiazraqib, can you be more specific?

I realize this interaction might be the cause of the issue, but I want to know why so I can find a workaround.

The show/hide map interaction needs to stay because otherwise the map cannot be interacted with.