issue with portal Hamburg menu hover

[Yasin Shaik11]

@jaheerhattiwale 

Hi Jaheer,

Good AfterNoon. 🙂

Whatever we have created Hamburg menu is working fine that means whenever user hover on the Hamburg menu it will show the list of items that is Okay. But when the user hover out(that means remove the cursor from the Hamburg menu) immediately it has to be remove the Hamburg menu items. Like for example if you can see the attachment the mouse cursor not present on the Hamburg menu even though the hover is working. Here we would like to work this operation when the hover takes place on the Hamburg menu.

What are the modifications are required in UI script as given below. Please do needful.

UI script:

$(document).ready(function() {
setTimeout(function() {
$("#sp-nav-bar ul li a").first().mouseover(function() {
$("#sp-nav-bar ul li a").first().trigger('click');
});
}, 1000);
});

[jaheerhattiwale]

@Yasin Shaik11 The menu works like that only.

Please comment all the script in ui script and check the OOTB feature of menu. Its same.

After verifying you can uncomment the code.

Please mark all the answers on this questions as correct answers.

[Yasin Shaik11]

@jaheerhattiwale 

Hi Jaheer,

Good Morning.
Yes understand it is a OOTB. but when we added our hover functionality it is not working. but my client asking for the same . is it possible ? 

[jaheerhattiwale]

@Yasin Shaik11 You mean on hover its not showing the background color?

[Yasin Shaik11]

Yes, that is the one case and another one is when we hover out from the Hamburg menu to other items background colour remains present on the Hamburg menu even if we hover on the other items. please refer we below attachment for your reference. 

[Siddhesh2]

Hello @Yasin Shaik11 

Could you please provide the solution for hover effect as I am trying implement the same in community portal.