Elementor Close Off Canvas On Anchor Link Click

Elementor Close Off Canvas On Anchor Link Click

First, add this code on the same page as your Elementor off canvas with anchor links

This is usually done in your header template. Place it where your Off Canvas element is located.

Add a new HTML element and paste the following code into it.”

				
					<script>
/* Code from https://element.how/elementor-close-off-canvas-on-anchor-link-click/
*/
document.addEventListener('click', function (event) {
    if (event.target.closest('a[href*="#"]:not([aria-haspopup="true"])') && event.target.closest('.e-off-canvas[aria-hidden="false"]')) {
        const canvasTrigger = document.querySelector('[href*="canvas"][aria-expanded="true"]:not([href*="%3Aopen"]');
        if (canvasTrigger) canvasTrigger.click();
    }
});
</script>

				
			

Then, go under Advanced > Positioning for the HTML element

Navigate to Advanced > Positioning and set the HTML element to position: absolute. This prevents it from affecting the page layout and makes it easy to locate using the navigator.

Do you need an expert? HIRE US NOW!