• Resolved Marteens

    (@marteens)


    Hi.

    I have a small problem with the drop down menu on my site. When the mouse is just outside the menu, the menu dissapears, and I have to go back to the top. This can be a bit annoying when the menu has 3 or 4 levels. Is ther some way to put a delay on the menu so it doesn’t go away at once?

    Thanks you!

Viewing 10 replies - 1 through 10 (of 10 total)
  • Thread Starter Marteens

    (@marteens)

    I found this thread, with a similar problem. So I tried to do what they said, but so far no luck. I found the “.slideUp()”, like they said to do, in

    wp-content --> themes --> rumput-hijau --> js --> methods.js

    And it looks like this:

    /* Drop down menus */
    
    	$j(".inside-primary-nav ul li ul").parent().addClass("arrow");
    
    	$j(".inside-primary-nav ul li").hover(function(){
    
            $j(this).addClass("hover");
    
            $j(this).find("ul:first").slideToggle("fast");
    
        }, function(){
    
            $j(this).removeClass("hover");
            $j(this).find("ul:first").slideUp("fast");
    
        });

    I tried to insert .delay(‘900’) before the .slideUp like this

    $j(this).find("ul:first").delay('900').slideUp("fast");

    but that messes up the menu.. do I have to put it in another place? Any ideas?

    Theme Author Ga Satrya

    (@satrya)

    I thought you just found the answer, right?

    you only need to remove the fast in slideUp("fast"), change it with 900

    Thread Starter Marteens

    (@marteens)

    Do you mean in the original or in the one where I had put the .delay(‘900’)?

    I tried both to be sure, and maybe I did something wrong because it’s not working. First i tried

    $j(this).find("ul:first").slideUp("900");

    and as far as I can tell nothing changed. Then I tried

    $j(this).find("ul:first").delay('900').slideUp("900");

    and that messes up my menu. It closes when I am hovering over it.

    Theme Author Ga Satrya

    (@satrya)

    No, you don’t need the .delay('900') , just try it

    /* Drop down menus */
    	$j(".inside-primary-nav ul li ul").parent().addClass("arrow");
    	$j(".inside-primary-nav ul li").hover(function(){
            $j(this).addClass("hover");
            $j(this).find("ul:first").slideDown("slow");
        }, function(){
            $j(this).removeClass("hover");
            $j(this).find("ul:first").slideUp("slow");
        });
    Thread Starter Marteens

    (@marteens)

    I copied that code to try it out, but it isn’t quite what I am looking for. This code makes the menu slow down when it slides down, but the menu doesn’t remain any longer when your mouse goes of it.

    I would like that the menu remains like one second (or something) after you leave it with the mouse. In that way, if you leave it without intension, it wont go away, and you can continue.

    I left in the code you gave me, so you can see how my menu works now on my site.

    Thread Starter Marteens

    (@marteens)

    Is this what I am looking for? If it is, how can I insert it in my code?

    Thread Starter Marteens

    (@marteens)

    Theme Author Ga Satrya

    (@satrya)

    I fount it https://stackoverflow.com/questions/2966611/how-to-delay-hiding-of-a-menu-with-jquery-dropdown-menu

    Try this one

    $j(".inside-primary-nav ul li ul").parent().addClass("arrow");
    $j(".inside-primary-nav ul li").hover(function(){
        $j(this).addClass("hover");
        $j(this).find("ul:first").slideDown("slow");
    }, function(){
        $j(this).removeClass("hover");
        setTimeout(function() {
            $j(this).find("ul:first").slideUp("slow");
        }, 1000);
    });

    Thread Starter Marteens

    (@marteens)

    Hi.

    That still doesn’t do it I’m afraid. I can’t understand why it won’t work.

    This code made the menu drop down slow the first time you hover it. The second time you hover it it seems like it has already been opened, so it just pops up. But the slide up dosen’t change. When I take the mouse of the menu, it still dissapears.

    Maybe we are looking in the wrong file? could it be something in the jquery.mobilemenu.js file for example? (I am just guessing). If not, maybe something else in the methods.js could do it. The other .js files doesn’t seem to have anything to do with the menu.

    By the way I am very gratefull that you are helping me out here, satrya.

    Thread Starter Marteens

    (@marteens)

    I got some help in the Stackoverflow forum and we found a solution. This is my new methods.js – file.

    And here is a link to where I got the help: https://stackoverflow.com/questions/17504845/how-to-delay-the-drop-down-menu-for-my-website/17507437?noredirect=1

    Thanks again! Here is a link to my site, if you want to see how it’s working (my site has an issue with IE, so the menu isn’t working properly there yet – but I’m working on it).

Viewing 10 replies - 1 through 10 (of 10 total)
  • The topic ‘How to delay the drop down menu’ is closed to new replies.