Hamburger mobile menu sends to wrong pages

[mscongdon]

The menu on our Moesia-themed site works fine on non-mobile devices. On mobile devices, however, clicking the hamburger expands all submenus, but clicking on the sub-menu-item does not go to the pages where they are supposed to.

For example, We have 4 top-level menu items, each with 1-4 sub menu items. The ones closest to the top of the screen seem to work fine. But the rest of the links seem to shrink the menu as we’re clicking on them and then we get directed to the page for the menu item which it collapsed to where our finger clicked. In other words, clicking seems to move the menu and then, wherever it lands is where we get directed.

How do we fix our mobile menu?

- Phoenix del Mar

Thank you,
Michael

[kharisblank]

Hi Michael,

Thank you for contacting us. I am happy to help with your queries.

We have a custom jQuery solution already to fix such that issue. And you can replicate it from this thread:

Expandable sub-menus in Moesia on mobile

Hello Alan, I am sorry for suggesting incorrect code. I noticed that the classes has been changed because of version update. Please replace the code with this one: ;(function($) { 'use strict' if ( matchMedia( 'only screen and (max-width: 991px)' ).matches ) { if( $('.menu-item-has-children').length ) { $('.menu-item-has-children').each(function(){ $(this).children('.sub-menu').wrap('<div class="sub-menu-wrapper" style="display: none;" />'); $(this).chil…

I hope that helps.

Regards,
Kharis
aThemes Support

[mscongdon]

Per those JavaScript commands, we found and wrapped the children. I wish we would have done that before the holidays

Thank you for the help. This solution works.

Best regards,
Michael

[kharisblank]

You’re welcome Michael!

Please let us know in a new topic if you have any further questions, or if we can provide you with any other assistance.

Regards,
Kharis
aThemes Support