How to close full page menu when clicking on anchor link in menu?

Design help Custom code
1

Hi - I created a full-screen menu that opens when you click on top right lottie (as you will see on site). I want to have the full-screen menu close, and also have the lottie return back to the closed position when clicking on a menu link. I was able to create an animation to close the menu when clicking on the anchor link, but I am unable to animate the lottie back to the close position as the lottie is its own component.

Read-only link here.

2

Super late to the party, but I was researching this for myself just now and all the fixes I could find in the forum didn’t work anymore.

I came up with a fix that works, so in case someone still encountering this issue in 2025/almost 2026 (can’t believe this issue hasn’t been resolved natively by now tbh) here is my fix that works:

I’m using a Relume navbar component (navbar18) based on the native Webflow navbar.

  1. Assign a custom attribute to your link-elements that are anchor links with name: “data-menu-close” and value: “true”
  2. Paste this code in the site settings in the before </body> code section:
  3. Update your class names for the querySelector (just tell your LLM of choice what your class names are)
<script>
document.addEventListener('DOMContentLoaded', function() {
    var allLinks = document.querySelectorAll('a\[href\], \[data-menu-close="true"\]');
    var menuToggle = document.querySelector('.navbar18_menu-button-2');
    if (menuToggle) {
        allLinks.forEach(function(link) {
            link.addEventListener('click', function(e) {
                var href = this.getAttribute('href');
                var isSamePageAnchor = href && href.startsWith('#');
                var isMenuOpen = menuToggle.classList.contains('w--open');
                if (isMenuOpen) {
                    menuToggle.click();
                    
                    if (isSamePageAnchor) {
                        e.preventDefault();
                        
                        setTimeout(function() {
                            var targetId = href;
                            if (Webflow && Webflow.scroll) {
                                Webflow.scroll.load(targetId);
                            } else {
                                window.location.hash = targetId;
                            }
                        }, 50);
                    }
                }
            });
        });
    }
});
</script>

Hope this helps somebody.