Jump to content

Hamburger Navigation with Submenus

Recommended Posts

Site URL: http://collectorsquadron.com

Hi all. I feel like I am so close to getting my navigation menu working properly, but after trying tons of CSS and Javascript codes, I still can't figure out how to fix the bugs on desktop. Currently, the navigation menu is hidden and the hamburger menu is forced to show on mobile and desktop. I have used folders to set up a multi-level menu for my shop categories, but on the desktop version, the submenus and scrollbar are showing up over the content of the website. The menu is also making the social links disappear when open. Can anyone help me fix this??

Site: collectorsquadron.com (live site, no pw needed).

Link to comment
  • Replies 1
  • Views 241
  • Created
  • Last Reply

Top Posters In This Topic

Top Posters In This Topic

On 4/13/2022 at 2:26 AM, justjilllauren said:

Site URL: http://collectorsquadron.com

Hi all. I feel like I am so close to getting my navigation menu working properly, but after trying tons of CSS and Javascript codes, I still can't figure out how to fix the bugs on desktop. Currently, the navigation menu is hidden and the hamburger menu is forced to show on mobile and desktop. I have used folders to set up a multi-level menu for my shop categories, but on the desktop version, the submenus and scrollbar are showing up over the content of the website. The menu is also making the social links disappear when open. Can anyone help me fix this??

Site: collectorsquadron.com (live site, no pw needed).

With icons disappear, add this to Design > Custom CSS

/* Fix header icons */
@media screen and (min-width:768px) {
body.header--menu-open .header .header-actions .icon--fill svg {
    fill: black !important;
}
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

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.