Jump to content

Mobile - Menu not exiting when clicking navigation anchor links.

Recommended Posts

Site URL: https://www.soundproacademy.com

Hi everybody, 

Having a problem with my website.

I created multiple anchor links using page section ID and they work perfectly on desktop.
However, when I click on them from the mobile drop down menu, the menu doesn't automatically exit and basically the website is unusable after you click one of the links. 
I need to know how to fix it or I'll have to ditch anchor links completely... but I feel there must be a way, I can't be the only one having this problem.

Here's the website so you can check the mobile navigation behaviour yourself:

Thanks a lot!

Link to comment
  • Replies 3
  • Views 630
  • Created
  • Last Reply

Top Posters In This Topic

Popular Days

Top Posters In This Topic

Hey there! I tested out some things on my site and it looks like instead of making the link "#page-section-61fbc90ee4129e490e044763" (or whatever your specific id is), you will need to prepend that link with the URL slug of the page. So try something like "/home/#page-section-61fbc90ee4129e490e044763". This is the only thing that worked for me on both desktop and mobile.

The only thing is that it refreshes the page before scrolling down to that section on desktop whereas before, it would smoothly scroll down to the section on desktop, but I personally don't think that's such a bad trade-off. If you were hoping to keep the smooth scrolling affect, I'm sure there is a code solution for that somewhere.

Hope this helps!

Feel free to email me with any customization inquiries or questions you may have!

Free Squarespace Resources: DevTools Minicourse,  11-Step Guide to Improve Custom CSS, Free Product/Pricing Comparison Table Generator

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.