Question

我正在使用jQuery和CSS构建一个下拉菜单。当你在菜单项上面时，它下面会显示一个子菜单项列表。

但是，因为这会影响整个菜单的高度（子菜单会将其下方的菜单项向下推），所以在尝试导航时会产生不需要的弹跳效果。

我想我可以通过延迟切换子菜单的jQuery函数来阻止这种情况，直到上一个切换完成。

这可能吗？

看看下面的小提琴，这是我目前的js：

$(document).ready(function () {  // Shows animates submenu transition
    $("ul.available_actions li").hover(function () {
        $("ul.available_actions li ").removeClass("menu_show");
        $(this).delay(30).addClass("menu_show");
        $(".menu_show ul li").toggle(170);
    });
});

这是一个小提琴的链接：http://jsfiddle.net/msEKE/
（请忽略子菜单项，它使用的是Asp.Net MVC）

Answer 1

我想你想要stop()：

$(".menu_show ul li").stop().toggle(170);

Jquery / CSS菜单 - 延迟切换，直到上一个切换完成

1 个答案:

Demo