jquery - 使用 jQuery 制作 CSS 动画

Question

所以我的 CSS 看起来像这样:

.dropdown{
position:absolute;  
display: none; 
width: 69%;
background-color: #6f6f6f;
margin-right: 35px;
z-index: 999999999;
padding: 3%;
margin-top: 20px;
}
#nav-menu > li:hover > .dropdown{
display: block;
top:auto;
}

这很好用，但是我想在悬停时使用 jquery 缓动插件的效果

我知道有一个显示/隐藏 jquery 函数，但它对下拉菜单的 react 不如使用 css 好(当用户与之交互时，下拉菜单并不总是保持显示)，这似乎每一个都有效时间。

所以我真的只是想给显示添加一个效果:无；然后是 display:block 悬停。如果这很简单，请原谅我，我的 jquery 技能不是很好，我在任何地方都找不到答案

fiddle

fiddle

Answer 1

DEMO

DEMO2

试试这个

$(document).ready(function () {
$(".menu_right").hover(
  function () {
      $(".dropdown").slideDown();
  },
  function () {
   $(".dropdown").slideUp();
  }
);
});

希望对你有帮助，谢谢