Anchor remains in the website URL on page refresh

hey guys,

I am using anchors on my website section, and point to those sections through the links in navbar.

after I scrolled to one of the section using an anchor link, an anchor tag appears in the web address accordingly.

however when I refresh the page, on the CUSTOM DOMAIN the page reloads on the website header, but the anchor tags remain there. for example I reached website.com/#price-calculator, then reloaded the page where I see the same link with an anchor from the sections below, while the header is in front of me. so it gets confusing because why would it say something about the price-calculator if it’s nowhere near. however on the WEBFLOW.IO DOMAIN there is no such issue, and it refreshes to the same website section.

is there an option to clear the anchor tag from the webpage address on reload? or at least return to the same section on page refresh on the CUSTOM DOMAIN, and not to the header, so that it was not confusing. but I would prefer the first option with removing tags from the link on reloading.

thank you

I haven’t looked into the details of your page, but two things I see on your staged site;

  • You have an initial page-loading animation and script that obscures the page while it’s first being loaded.
  • It looks like you have a script that is intercepting the #fragment references, and doing a controlled scroll to that postion.

Either of those features, or both together, could be interfering with the browser’s ability to navigate to that section when you have your #fragment in the initial URL request. Meaning, you’ve asked it to navigate, but then either that section isn’t visible yet, or your intercepting that navigation request with your stylized-scrolling script.

I’m using Chrome, but I think most browsers will have the same issue. You don’t experience that problem on a main menu click, because the page is already loaded, and the loading animation and your scroll-script are ready to go.

There’s not much you can do about that. Maybe check the docs for your scroll script and/or look at add another script that checks for the # 1500ms after the page ready event. That way you can be pretty sure that everything is visible, and you can than re-issue your navigation request in the form of a scrollTo command.

hey thanks for the answer, but I just realized that the issue is happening only on the published custom domain.

it returns to the same anchored section after refresh on the webflow.io domain but not on the custom…

For me using Chrome, I can see the behavior on your webflow.io domain. For you, that page is already in your cache, so it loads fast enough for the navigation to work. If you clear your cache, or open dev tools and click Disable cache on the Network tab, you’ll see it too.