jquery - 链接 jQuery 元素以在悬停时显示

Question

有没有一种简单的方法来链接 jquery 元素，用于悬停。我在http://jsbin.com/useviz/3/edit有 jsbin我基本上有它，因此当您将鼠标悬停在元素上方时它不会关闭当ul您将鼠标移到元素上方或上方时会出现问题到下一个元素。原来的ul不隐藏。这可能听起来令人困惑，但是如果您查看上面的示例，您会发现。

Answer 1

您不需要检查要隐藏的元素是否存在，您可以根据需要隐藏它。我已经添加$(".sub_menu").hide(700);到每个鼠标悬停功能，它的工作原理！见http://jsbin.com/useviz/6/

Answer 2

像这样的东西，

现场演示在这里

$(document).ready(function () {

    $("#servicebutton").mouseenter(function () {
        $('.sub_menu').hide();
        $('.sub_menu1').show(700);
    });

    $('.sub-menu1').mouseleave(function () {
         $('.sub_menu1').hide(700);
    });

    $("#packagebutton").mouseenter(function () {
         $('.sub_menu').hide();
         $('.sub_menu2').show(700);
    }); 

    $('.sub-menu2').mouseleave(function () {
         $('.sub_menu2').hide(700);
    });

    $("#productbutton").mouseenter(function () {
       $('.sub_menu').hide();
       $('.sub_menu3').show(700);
    });

    $('.sub-menu2').mouseleave(function () {
       $('.sub_menu3').hide(700);
    });

  /* catch-all for submenus */
  $('.sub_menu').mouseleave(function(){
      $(this).hide(700);
  });
});