Nav Sub Menu Hover Delay Time

[Stigan]

On my site we have added custom style to make the nav sub menu full width, but when you move along the menu to select the sub page the menu disappears very quickly/easily. How can we make the menu less sensitive for a better user experience? Thank you

[ruenel]

Hello @Stigan,

Thanks for writing in! I can see that the submenu is already active already.

As long as you hover over a menu item, the submenu should display mcuh longer. If your custom code is not enough, you can add display: block; in your code. For example:

.desktop .menu-item:hover .sub-menu {
    display: block;
}

Kindly let us know how it goes.

[Stigan]

Hi sorry I think you misunderstood. The sub menu is active, my issue is that it is a bit glitchy when you try to navigate the site ie. it disappears too soon when you are trying to get to the link you want to click. Is there a line of code that controls the delay on this? I am talking about for the end user, not for me when I edit it.

[ruenel]

Hi Stigan,

The delay is only applied when you hover over the menu item and as you hover out the menu item. As long as your mouse pointer is hovering within the menu item, the submenu should not disappear. When you move your mouse pointer outside of the menu item or the wide submenu area, the submenu will close. Yes, there is a slight delay and this is triggered by the mouse pointer event with the help of a JS script built in the theme. Regretfully we do not recommend editing the minified JS resource files as it may lead to further conflict and issues. It is best that you add some paddings around each and every menu item instead so that there will be enough space for the mouse pointer to move around.

Hope this helps.