无法保持jQuery下拉列表滑落

Question

所以我正在为某个人创建一个网站,而且我对jQuery很新(这可能没什么帮助).该网站需要一个下拉菜单,以显示列表中的图库链接,而不是在导航栏中显示所有链接.问题是,每当我将鼠标悬停在li元素上时,下拉列表会向下滑动,但当我将鼠标悬停在下拉列表上时,它会向上滑动.

$(document).ready(function () {
  $("li#navi-dropdown").hover(
    function () {
      $('ul.nav-dropdown').slideDown('medium');
    }, 
    function () {
      $('ul.nav-dropdown').slideUp('medium');
    }
  );
});

可能很简单,但非常欢迎帮助.JSFiddle如下.

http://jsfiddle.net/6e87Lwkb/

Answer 1

考虑将 ul 子菜单放入 li 中，并重新定位它。不要忘记也使用 .stop() ，这样 jquery 就不会对幻灯片动画进行排队：

$('ul.nav-dropdown').stop().slideDown('medium');

在这里查看您更新的小提琴