Question

我会添加一个延迟来滑动我的Dropdownmenu。如果我离开子菜单链接，它应该在2秒后滑动。目前它立即滑动。问题是如果你离开Dropdownmenu它关闭。

****更新（18.4.2014 / 18:40）：**

**这个版本不起作用。 jQuery slideUp after delay。 Menü快速关闭（看这里：http://www.kcserver.info/codecanyon/nav/demo/demo.html）在lennox的回答中：dropdownmenü保持开放状态（http://www.kcserver.info/codecanyon/nav/demo%20Kopie/demo.html）****

守则：

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)
    });
}

JQuery添加延迟slideUp mouseleave

1 个答案: