JQuery Add delay slideUp mouseleave

Question

I will add a delay to slideUp my Dropdownmenu. If i leave the Submenu Link it should slideUp after 2 sec. Currently it slideup immediately. The Problem is if you leave the Dropdownmenu it close .

****Update (18.4.2014 /18:40):**

**This version dont work. jQuery slideUp after delay. The Menü close fast (Look here:http://www.kcserver.info/codecanyon/nav/demo/demo.html) In the answer of lennox: The dropdownmenü stay open (http://www.kcserver.info/codecanyon/nav/demo%20Kopie/demo.html)****

The Code:

if ($(window).width() > 962) {
    $("ul#menu li ul li:has(ul)").find("a:first").addClass("active");
    $("ul#menu li").hover(function() {

        $(this).addClass("hover");
        $('ul:first', this).css('visibility', 'visible');
        $(this).children('ul').delay(20).slideDown(300); // speed of the slide

    }, function() {

        $(this).removeClass("hover");
        $('ul:first', this).css('visibility', 'hidden');
        $(this).children('ul').delay(20).slideUp(200); // speed of the slide

    });
}

Answer 1

if ($(window).width() > 962) {
    var slideupTimeout = undefined;
    $("ul#menu li ul li:has(ul)").find("a:first").addClass("active");
    $("ul#menu li").hover(function() {
        // If they re-enter, cancel the slideUp
        if (typeof slideupTimeout == "number") {
            clearTimeout(slideupTimeout);
            slideupTimeout = undefined;
        }

        $(this).addClass("hover");
        $('ul:first', this).css('visibility', 'visible');
        $(this).children('ul').delay(20).slideDown(300); // speed of the slide

    }, function() {
        var that = this;

        // Cancel if present, don't want to leak these.
        if (typeof slideupTimeout == "number") {
            clearTimeout(slideupTimeout);
            slideupTimeout = undefined;
        }

        // In 2 seconds, call slideUp
        slideupTimeout = setTimeout(function() {
            $(that).removeClass("hover");
            $('ul:first', that).css('visibility', 'hidden');
            $(that).children('ul').delay(20).slideUp(200); // speed of the slide

            // Be sure we're always managing this ID properly. We don't want
            // it to linger and accidentally cancel an unrelated timer!
            slideupTimeout = undefined;
        }, 2000)
    });
}