单击下一个菜单项时防止向下滑动子菜单向上滑动

Question

我有一个下拉菜单，其中包含子菜单中的链接，当我单击菜单中的另一个链接时，我希望子菜单链接淡入而其他淡出（无需关闭并再次打开）。目前，当我单击另一个菜单项时，子菜单会向上滑动然后再向下滑动以显示该子菜单中的项目。

这是小提琴http://jsfiddle.net/EGp35/1/。如果需要，请随意更好地构建代码。此外，唯一的活动链接是“节目”和“电影”。谢谢！

$(document).ready(function() {
    $('#shows').click(function(e) {
        $('.sub-menu-1').slideToggle(200);
        $('.sub-menu-2').hide();
            return false; // prevent default click action from happening!
            e.preventDefault(); // same thing as above
    });
});


$(document).ready(function() {
    $('#films').click(function(e) {
        $('.sub-menu-2').slideToggle(200);
        $('.sub-menu-1').hide();
            return false; // prevent default click action from happening!
            e.preventDefault(); // same thing as above
    });
});

Answer 1

替换

   $('.sub-menu-1').slideToggle(200);
   $('.sub-menu-2').hide();

与

  $('.sub-menu-1').slideDown();
  $('.sub-menu-2').slideUp();

Here the fiddle