If you’re experiencing a glitch on all pages with anchor links in Webflow, several common causes could be disrupting the anchor link behavior or causing unexpected scroll/jump effects.
1. Missing or Misplaced ID Attributes
- Anchor links (e.g., links that go to
#section
) must point to an element with a matching ID. - Check that the target element has the correct ID (e.g., section’s ID is
section
for a link to #section
). - Webflow sometimes auto-generates IDs based on section names—if you rename them, verify the ID hasn’t changed or disappeared.
2. Fixed Navbar Without Anchor Offset
- If you’re using a fixed-top navbar, anchor links may scroll the user behind the navbar.
- To avoid this, add top margin/padding to the section you're linking to or use anchor offset using custom code or in-page scroll adjustments.
- Alternatively, structure the layout so there's enough spacing above target elements.
- Webflow has built-in smooth scrolling for anchor links.
- If you’ve added custom smooth scroll JavaScript, it can conflict with Webflow's native behavior.
- Disable your custom script or duplicate the project and remove custom code to test.
- If you’ve set up scroll-based interactions, they may be triggered too early or late when jumping to anchor points.
- Adjust the Scroll Timeline or Offset % in any relevant animations to better align with anchor behavior.
5. Anchor Links to Hidden or Incorrect Elements
- Ensure you're not linking to elements inside tabs, modals, or hidden sections, as anchor links won’t scroll correctly to those.
- When possible, link only to visible elements on initial page load.
6. Custom Code Interfering With Anchors
- Review any custom JavaScript or third-party libraries that modify the DOM or use scroll events.
- Temporarily disable them to rule out interference with scroll behavior.
7. Anchor Links Between Pages
- If you're linking to an anchor on another page (e.g.,
/about#team
), Webflow can lose the anchor scroll on load. - You may need custom JavaScript to scroll to the anchor on page load after routing.
8. Page Load Behavior
- Some glitches occur if a page hasn't fully loaded before trying to scroll to an anchor.
- You can add a small delay in custom code before scrolling (e.g., via
setTimeout()
) to ensure the anchor scroll triggers after all assets load.
Summary
Anchor link glitches in Webflow are commonly caused by missing IDs, fixed navbars without offset, or conflicting custom scripts. Check your section IDs, layout spacing, and custom code to ensure clean scrolling behavior. If the glitch happens across all anchor links, start by testing without any custom code or interactions.