Docs

[Daniel]

Hi,
I’d like to know how to close mobile menu when user selects menu item.

I’m working on http://blog.pallycon.com using wordpress v4.1, X theme v3.2.1 and X shortcodes v3.0.3.

When I’m using its main menu on mobile device, the dropdown menu blocks most of the screen even after I clicked one of the menu item. I want the menu goes back to its normal status (not showing the dropdown) on select.

How can I do it?

[Daniel]

For your information, I’m using the below custom CSS for Contact Form 7 plugin and fixing mobile menu on top.

.wpcf7-form .wpcf7-not-valid-tip {
    display:none;
}

.wpcf7 .screen-reader-response {
    display: none;
}

@media (max-width: 979px) {
.x-navbar-fixed-top, .x-navbar-fixed-left, .x-navbar-fixed-right {
position: fixed;
}
}

[Nabeel A]

Hey Daniel,

Thanks for writing in! To fix your issue, please add the following jQuery script via Appearance > Customize > Custom > Javascript

jQuery(document).ready(function($){
	$('.menu-item a').click(function(){
		$('.x-nav-wrap.mobile').removeClass('in');
	});
});

Don’t forget to clear your browser’s cache after adding the code.

Let us know how this goes!

[Daniel]

Hi,

Seems the code works.
Thank you so much for your support!

[Thai]

You’re always welcome.

[Author]

Posts