Open/Close submenu in Side Slideout Menu

[CallidusPro]

Hi,

I want to change the behavior of the Side Slideout Menu when a sub menu is open, when I click a menu with submenu, the main menu changes the arrow icon from “to bottom” to “up”, I want to click in the “up arrow” icon and instead of going to the main menu link, close the submenu list.

How can I do that?

Thanks

[David Martin – Support]

Hi,

If you open functions.js. Locate this:

			// Mobile Menu parent click
			jQuery('#mobile-menu li > a').on('click', function(e) {
				var parentMenuItem = jQuery(this).parent(),
					linkHref = jQuery(this).attr('href'),
					subMenu = parentMenuItem.find('ul.sub-menu').first();

				if (!parentMenuItem.hasClass('parent')) {
					SWIFT.nav.mobileMenuHideTrigger();

					if (linkHref.indexOf('#') === 0 && linkHref.length > 1) {
						SWIFT.isScrolling = true;
						SWIFT.page.onePageNavGoTo(linkHref);
						setTimeout(function() {
							SWIFT.isScrolling = false;
						}, 1000);
						e.preventDefault();
					} else if (body.hasClass('page-transitions')) {
						SWIFT.page.fadePageOut(linkHref);
					}

					return e;
				}

				if (parentMenuItem.hasClass('sub-menu-open')) {
			
					if (linkHref.indexOf('http') === 0 || linkHref.indexOf('/') === 0) {
						return e;
					} else {
						parentMenuItem.removeClass('sub-menu-open');
						subMenu.slideUp();
						e.preventDefault();
					}
				} else {
					parentMenuItem.addClass('sub-menu-open');
					subMenu.slideDown();
					e.preventDefault();
				}
			});

Then replace with this:

			// Mobile Menu parent click
			jQuery('#mobile-menu li > a').on('click', function(e) {
				var parentMenuItem = jQuery(this).parent(),
					linkHref = jQuery(this).attr('href'),
					subMenu = parentMenuItem.find('ul.sub-menu').first();

				if (!parentMenuItem.hasClass('parent')) {
					SWIFT.nav.mobileMenuHideTrigger();

					if (linkHref.indexOf('#') === 0 && linkHref.length > 1) {
						SWIFT.isScrolling = true;
						SWIFT.page.onePageNavGoTo(linkHref);
						setTimeout(function() {
							SWIFT.isScrolling = false;
						}, 1000);
						e.preventDefault();
					} else if (body.hasClass('page-transitions')) {
						SWIFT.page.fadePageOut(linkHref);
					}

					return e;
				}

				if (parentMenuItem.hasClass('sub-menu-open')) {
					
					subMenu.slideUp();
					e.preventDefault();
					parentMenuItem.removeClass('sub-menu-open');

					if (linkHref.indexOf('http') === 0 || linkHref.indexOf('/') === 0) {
						return e;
					} else {
						parentMenuItem.removeClass('sub-menu-open');
						subMenu.slideUp();
						e.preventDefault();
					}
				} else {
					parentMenuItem.addClass('sub-menu-open');
					subMenu.slideDown();
					e.preventDefault();
				}
			});

Disabled the Load pre-minified scripts from within Theme Options => General Options.

[SHK111]

Not working for me.
came to :
htdocs/wp-content/themes/atelier/js
modify and replace

[David Martin – Support]

You also must do this:

Disabled the Load pre-minified scripts from within Theme Options => General Options.

[SHK111]

Yes I did

[David Martin – Support]

Will need to check your implementation. Please add your FTP details.

[SHK111]

This is the functions.js

Attachments:

You must be logged in to view attached files.

[David Martin – Support]

Will need a URL/FTP details.

Thanks.

[SHK111]

If I’m dropping the info in private here, are you the only on to read it or the creator of this topic can read it too?

[David Martin – Support]

As this is not your own thread, please open a new thread.

You can set a different menu to mobile. So without even needing the above JS you can simply set the parent link to a custom link # rather than a full URL. This will automatically open/close as you need.

Thanks.