Menu on ipad worked perfectly before update, it now functions terribly

Hi there, please see: https://www.logoglo.com/

Here is a video on how it is working on my ipad: https://www.logoglo.com/wp-content/uploads/2023/01/IMG_3333_MOV_AdobeExpress.mp4

I have tested on other mobile devices, such as android, and seams to work as should. It also works fin on desktop and laptop.

I have already troubleshooted, disabling all plugins, clearing all caches, trying incognito, it doesn’t work in chrome either, on the ipad, so not just safari.

Login in secure note.

Thanks.

We’ll get this event handling fixed. To confirm is this a custom header or the default x header?

Awesome, thanks! this is a default header, so it wasn’t made in cornerstone.

1 Like

Hello @oriol,

As you are using the default header, please note there is a custom Header/Footer builder on the Pro theme which can be created through the header/footer builder by using the cornerstone. In case you have not seen our doc of Header builder please have a look at it.

Hope it helps
Thanks

I understand this, but the header I have is for an old site, that I don’t want to spend time on fixing.

Your updates should be future proof, and cater for clients who built headers the old way.

The issue is still occurring.

Hello @oriol,

Yes, it would be fixed, our development team is working on it and I would request you, please stay tuned for succeeding theme updates.

Thanks for understanding

Thank you.

You are most welcome, @oriol.

Any update to this? is this a general error with the update? or something more specific on my site? It has been a week now, and all my users on ipads are telling me about my menu, and cant use the site.

I’m loosing customers.

Any chance of a quick fix for the site before you update the theme?

Thanks.

Hi @Oriol,

You can use this CSS code temporarily:

@media (max-width: 979px){
    body {
        overflow: hidden;
    }

    .x-navbar-fixed-top .x-navbar-inner{
        max-height: 100vh;
        overflow-y: scroll;
    }
}

Please bear with us.

Thanks, I added the above code, cleared all caches, and viewed the site incognito, yet the issue is still present.

I had this js code on the site:

jQuery(document).ready(function($){
	$('.x-one-page-navigation-active .x-navbar .mobile .x-nav > .menu-item:not(.menu-item-has-children)').on('click touchend', function(e) {
		document.getElementsByClassName("x-btn-navbar")[0].click()
	});
});

I took that out, and the menu is now working on the ipad…However the menu now, on mobile, and ipad, stays open as it scrolls to the section, as appose to how it was, where the menu would contract upon scroll…

I think form a UX point of view, it should contract as when it gets to the menu item,…right now, you have to click the menu for it to close again.

Any help would be appreciated.

Thanks.

Hi @Oriol,

Please check out this JS code provided in this old thread:

Cheers.

I tried that, but its behaving strangely see video:

Any luck with this?

I would try again in 6.0.7 and see if you have this issue. We had some “#hash” based code that was misplaced in V6 and added back in.

Thanks, I updated, flushed caches, and even tried the old js script too, but the issue still persists.

I apologies it has taken us this long to address your issue. I will be taking a look this week at your header issues.

Thanks for the update.

Try viewing your site again and clear any browser caches if you still see it. I had to use wp rocket and it looks like it’s fine now after updating your global js.

To anyone else trying to get a mobile menu to close after a click. This is what I used. I will add these x functions to https://theme.co/docs/toggleable

$('.x-navbar .x-nav-wrap.mobile a').each(function() {
$(this).on('touchend click', function(){
    setTimeout(function() {
      // Toggle mobile menu to off
      window.xToggleUpdate('x-nav-wrap-mobile', false)
    }, 1000);
});
});