.stop（）在Wordpress中表現得很奇怪

Question

我正在使用wordpress組合網站。我用代碼模擬了導航，並且按照我希望的方式工作。 http://codepen.io/ElaineM/pen/GgjgVE

$(".menu-item").mouseover(function(){ 
     $(this).find("ul").stop().slideDown(500); 
}); 
    $(".menu-item").mouseout(function(){ 
     $(this).find("ul").stop().slideUp(500); 
    }); 

然而，當我更新WordPress的我的項目文件，在下拉子菜單中是不可見的。當我從jQuery函數中刪除.stop（）時，下拉菜單在mouseover上可見，但動畫無休止地循環。 http://www.elainematthias.com/

我也有下面的子菜單使用下面的代碼，但我寧願用.slideDown（）和.slideUp（）或類似的動畫效果軟化子菜單外觀。

$(".menu-item").mouseover(function(){ 
      $(this).find("ul").css("display","block") 
     }) 
     $(".menu-item").mouseout(function(){ 
      $(this).find("ul").css("display","none") 
     }) 

Answer 1

從子菜單<ul>刪除height: 1px;。 jQuery的功能

$(".menu-item").hover(function(){ 
     $(this).find("ul").stop().slideDown(500); 
},function(){ 
     $(this).find("ul").stop().slideUp(500); 
    }); 

工作演示http://jsfiddle.net/L05h18ue/4/

更少的代碼