Jump-to menu iphone note working properly

[Markhad]

I have a submenu and one of them is a jump-to. It works fine on the computer. However, on the mobile, it only works if I am not on the same page as the jump to.

For example, on a page call mystuff I have a section called prices. If I am on my home page and use the menu to prices, it opens the mystuff page and jumps to prices perfectly. However, if I am already on mystuff page and click on prices, it gets stuck on my phone as the menu isn’t closing as I’m not changing pages. If I close the menu I am at the right place but it would confuse the user as it looks like the link isn’t doing anything.

Please help.

[ruenel]

Hello There,

Thanks for writing in! I have checked the page and I can see the issue. To resolve your issue, please add this JS code in the Theme Options > Global JS (http://prntscr.com/evswzb) or in the customizer, Appearance > Customize > Custom > Edit GLOBAL Javascript

(function($){
  $('.x-off-canvas .x-anchor-menu-item').on('click touchend', function(){
    $('.x-off-canvas-close').trigger('click');
  });
})(jQuery);

Hope this helps. Please let us know how it goes.

[Markhad]

Thank you. Unfortunately this makes it worse.

Now, when I click on the menu item, instead of showing the sub menu to choose an option it closes it. I’ll add a private post belwo with a link to my site so you can see. It’s only an isse on the collapsed navigation.

[christopher]

Hi there,

I added a condition when this code will be triggered and it should work ok:

(function($){
  $('.x-off-canvas .x-anchor-menu-item').on('click touchend', function(e){
  	if (($(this).attr('href').indexOf('#') !== 0) && (!$(this).next().hasClass('sub-menu'))) {
		$('.x-off-canvas-close').trigger('click');
  	}
  });
})(jQuery);

If the code is still not working for you please kindly get back to us with the URL/User/Pass of your WordPress installation using the Secure Note functionality if the post to follow up the case.

Thank you.

[Markhad]

Getting there but still not quite right. It works if I use my computer with the screen shrunk. If it’s on the mobile then it is closing the menu as desired but it now does not link to any page, it just closes the menu and stays on the page it is on.

WP info below:

[rad]

Hi there,

I changed your code to this,

jQuery ( function($) {

var protocols = /^(http|https)/;

//custom scrolling

$(document).ready( function() {

setTimeout( function() {

$('.x-anchor-menu-item:not([href="#"])').off().on('click', function(){


$('.x-off-canvas-close').trigger('click');

var hash = '#' + $(this).attr('href').split('#')[1];

if ( protocols.test( $(this).attr('href').toLowerCase() ) == true && $(hash).length == 0 ) {

window.location = $(this).attr('href');

} else {

var offset = $(window).width() <= 979 ? 0 : 104;

$('html, body').stop().animate( { scrollTop : $(hash).offset().top - offset } ); 

}


} )

}, 1000 );

} );

} );

Please check it. Cheers!

[Markhad]

Thank you. Had a quick play around and that looks like it’s solved it!

I’ll test more thoroughly this week and come back if there’s any issues.

Many thanks.

[thai]

You’re welcome.