Increase response time on drop down menu

Support
#1

I was wondering how to increase the drop down menu time.
Currently when you hover over a main link with sublinks it takes quite a bit of time for the sub-links to drop down.

How can I increase the speed of this motion so that it is almost instant.

The Website I am working on is https://clscm.org/

#2

Hello There,

Thanks for posting in!

To speed up the dropdown menu, please add the following CSS code in the X > Theme Options > Global CSS (http://prntscr.com/evui3r)

ul.sub-menu.x-dropdown,
ul.sub-menu.x-dropdown.x-active {
    transition-duration: 0.15s;
}

Hope this helps. Kindly let us know.

#3

So that speeds up the transitions.

But I still need to speed up the time between hovering over the link and the sub menu populating.

I would like it to show up right when you over over the link. Where right now there is a half second delay.

#4

Hi again,

Try replacing the previous code with this one:

ul.sub-menu.x-dropdown,
ul.sub-menu.x-dropdown.x-active {
    transition-duration: 0s !important;
    transition-delay: 0s !important;
    transition: none !important;
}

Then add the following code in the Theme Options > JS:

jQuery(document).ready(function($){
	$('.x-menu > .menu-item').hover(function(){
		$(this).find('ul.sub-menu').addClass('.x-active');
	}, function(){
		$(this).find('ul.sub-menu').removeClass('.x-active');
	});
});

Don’t forget to clear your browser’s cache after adding the code. Let us know how this goes!

1 Like
#5

Perfect! thank you!

#6

you are most welcome!

#7

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.