Vaggelis
Vaggelis

Reputation: 1011

Jquery ui menu issue

When you are leaving the parent item of a submenu in jquery menu,there is a slight delay closing the submenu. any way to disable this and make it close instantly ?

*iknow its a EOL dead library but i'm asking just in case any of you guys remember something !

$(function() {
            $("#menu").menu();
});
#menu{
width:150px;
}
<!DOCTYPE html>
<html>
<head>
<script src="https://code.jquery.com/jquery-3.6.0.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js" integrity="sha512-uto9mlQzrs59VwILcLiRYeLKPPbS/bT71da/OEBYEwcdNUk8jYIy+D176RYoop1Da+f9mvkYrmj5MCLZWEtQuA==" crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.css" integrity="sha512-aOG0c6nPNzGk+5zjwyJaoRUgCdOrfSDhmMID2u4+OIslr0GjpLKo7Xm0Ao3xmpM4T8AmIouRkqwj1nrdVsLKEQ==" crossorigin="anonymous" />

</head>
<body>
<ul id="menu">
                <li>
                    <div>W/O submenu</div>
                </li>

                 
                <li>
                <div>With submenu</div>
                <ul><li><div>Submenu</div></li></ul>
                    
                </li>

           </ul>
</body>
</html>

Upvotes: 0

Views: 183

Answers (1)

Paul T.
Paul T.

Reputation: 4907

The menu widget does have a 300 millisecond delay.

So, if you download the non-minified version of the js file, from here:

https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.js (based on the OP's URL)

Then use that file locally. Then, in the file, change the delay at line 4946 (in the menu widget, noted on line 4943):

4943 var widgetsMenu = $.widget( "ui.menu", {
4944         version: "1.12.1",
4945         defaultElement: "<ul>",
4946         delay: 300,               // THIS delay
4947         options: {

...to a lower value, say 100 (or lower), and then save, reload the page, and check the behavior.

Note that I would not remove the delay entirely, as there are references to that attribute/property, but set it to a lower value as to be virtually unnoticeable.

Upvotes: 1

Related Questions