Section link takes the user to the wrong section?

Design help General
1

Hi guys,

When viewed on a desktop, my site has a menu button ‘Events’ which is meant to link to the ‘Our events’ section like this:

works

However, the first time a visitor clicks on the ‘Events’ link, they are taken to the wrong position on the page:

doesn't work

Then on subsequent clicks of the events button they are taken to the correct place. I can’t seem to work out why its offsetting the link the first time visitors press it. Could anyone help?

The read only link is https://preview.webflow.com/preview/patchontheplaza-staging?utm_medium=preview_link&utm_source=designer&utm_content=patchontheplaza-staging&preview=87d764764d19ef09a4262336bc21e3d3&workflow=preview

To get to the link in question, go to c-menu desktop under the Site Navbar and then there is a c-menu–links grid, ‘events’ is the final link.

Thank you!

1 Like
2

It appears you have the link going to “events-temp” and should be going to “events”. It seemed to work when I made this change.

3

Hi Cris,

Unfortunately that hasn’t fixed it - I had created events-temp as an interim workaround and have since deleted it as it didn’t fix the problem either. N.B. the issue only appears on the published site rather than in the preview pane.

Thank you for taking the time to help all the same.

5

@parswt it looks like you’ve fixed this?

At least in Chrome, your staging site is navigating directly to the events section on the first Menu > Events click.

A note though, I often see two issues occur with respect to #fragment links.

When your URL includes a fragment, your browser is directed to scroll the view so that the specified item is visible. The browser will calculate where that item is in the layout, and scroll there.

However;

  1. A fragment identifier of e.g. #my-fragment identifies both <a name="my-fragment"></a> and elements with id="my-fragment. There is technically nothing to prevent you from creating multiples of these. It’s up to the browser to guess which one you mean.
  2. If the element you’ve id’d is not currently visible, the browser cannot guess where it will be, and it will likely scroll to 0,0, If you have variable-height content in-between you and your targeted element, you’ll get the wrong position. I haven’t done a proof, but I’d expect these problems to occur with certain interactions where things are expanding, contracting or shifting vertically as you scroll to them.