• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
Locked
0

Mobile Hamburger Sub-Menus

Engaged ,
Nov 09, 2016 Nov 09, 2016

Copy link to clipboard

Copied

Hey Guys, I have made a hamburger menu using the Panels Accordion widget in Muse a while back for my phone site. Now that my site is growing, I need to have sub options off of the listed buttons. Can anyone aid me with some ideas that have worked for you? Thanks! More in depth: • I click the hamburger menu • I get options like Home, Products, Company, News & Events, Technology and so on • Then I click Company • I'd get a few more options that I would have to choose from like: About, Board of Directors, Management Team, Contact and so on I'd greatly appreciate for anyones positive feedback! Thanks again! - Rob

Views

1.4K

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Nov 09, 2016 Nov 09, 2016

Copy link to clipboard

Copied

hi Rob, its hard to give desing help without seeing the site... have you got a url?

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
Nov 10, 2016 Nov 10, 2016

Copy link to clipboard

Copied

If your hamburger menu is an accordion widget -  then you can place a second accordion widget  inside the 1st with your sub categories.

Just make sure to clear all styles / states before you place it as it can be a pain clicking multiple times to dig deeper into the second accordion to style it.

Good luck

Garry

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Engaged ,
Nov 10, 2016 Nov 10, 2016

Copy link to clipboard

Copied

Thanks Nine_Design,

I'll give that a try.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Engaged ,
Nov 10, 2016 Nov 10, 2016

Copy link to clipboard

Copied

Nine_Design,

I just tried doing this. Its kind of working but, one of the buttons is an anchor link. Now that this is in place, the accordion does not collapse after click. Do you or anyone know how to do this? Once I figure this out then I think we've figured it out.

Thanks again!

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
Nov 10, 2016 Nov 10, 2016

Copy link to clipboard

Copied

Unfortunately I can't recreate your problem... works ok for me.

Have you clicked 'can close all' on the accordion widget?

accordion.jpg

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Engaged ,
Nov 10, 2016 Nov 10, 2016

Copy link to clipboard

Copied

Yes I have this option checked. I see when I click the anchor button it scrolls the page, but after closing the accordion I'm at the right section of the page. The problem is that its not collapsing after I click it.

I just found this blog where some guy had the same issue but somehow this girl was about to do it perfectly. Check it out!

Submenus in mobile menu issue | MuseThemes Forum

Not only that but she supplied the attachment to download. To bad that we couldn't learn how to make it the way she did.
Zippyshare.com - Collapsable Menu.mulib

Thanks,

- Rob

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Engaged ,
Nov 10, 2016 Nov 10, 2016

Copy link to clipboard

Copied

So I just finished redesigning this thing i found (Previous post). And its doing the same thing that i had put together previously. When the button is clicked on the panels don't close after clicking. They stay open.

Still trying to figure this out. Looks like a lot of blogs I come across are having the same issue.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Engaged ,
Nov 10, 2016 Nov 10, 2016

Copy link to clipboard

Copied

The only time the accordion closes is when a new page is loaded. So maybe if I have it link to the URL adding the anchor address #board-of-directors.

This might be the answer...

...Didn't work.

I played around with a few more ideas and I thought of a work around. So the only way it closes is when you are brought to a new page. With an anchor you slides the page down for you. Its doesn't load the page as new. So, what I did was I have 4 links in my sub menu. Then I created with sublime text an html re-direct page (4 of them for each link/button) that will go to the anchored spot to the original page. This is making the menu "forcefully" re-load allowing the menu to be closed once the page has loaded.

Tested and it works for a work around, until Muse brings some kind of feature out.

Thanks,

-Rob

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
Nov 11, 2016 Nov 11, 2016

Copy link to clipboard

Copied

Looks like it might be some kind of software / browser glitch?

I can't reproduce your error - i tried a quick mock and seems to work ok.

(mobile only version - right click > inspect > choose phone in Chrome)

mock mobile menu with subcategories

p.s. - do you preview site in browser?

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Engaged ,
Nov 11, 2016 Nov 11, 2016

Copy link to clipboard

Copied

LATEST

Yes I tested it on Chrome, Safari and Firefox. I never test in preview mode. I find that never really works that well. The link you've given me is also happening. Once you get to the anchor page and start clicking on the anchor links in the sub menu, it just scrolls down instead of refreshing the page to close the menu. When you scroll back up to look at it, the menu is still open instead of being closed. The point is after clicking it, we want the menus to close.

With my site I've set a parallax scrolling to it to follow at the top of the browser so then the user can have options to click on again instead having to scroll back to the top. So in my situation with the menu still being open, its cover the content still so the user has to manually close it after clicking on the button.

Sorry I may not be the best at explaining things.   I hope you understand now. I really appreciate your help with setting up that site to show me. Thanks

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines