jquery - 菜单项鼠标悬停时，fadeIn 正在工作，但没有fadeOut

Question

请帮忙; 我正在开发一个网站，我想要一个图像在 mouseenter 和 mouseleave 上淡入和淡出。

http://postimg.org/image/s82v127cp/

请看上面的图片。这是鼠标进入时的状态，带有淡入效果。所以fadeIn 很酷，但是fadeout 没有效果！我正在使用以下代码来实现这一点：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
</script>

    
    $(文档).ready(函数(){
        $("#menu-item-67").mouseenter(function(){
            $("#text-11").hide().fadeIn(1000);
        });

      $("#menu-item-67").mouseleave(function(){
        $("#text-11").fadeOut(1000);
      });
    });
    

Answer 1

你可以简单地这样做：

$(document).ready(function(){
 $('#menu-item-67').mouseover(function(){
  $("#text-11").fadeToggle(1000);
 });

 $('#menu-item-67').mouseleave(function(){
  $("#text-11").fadeToggle(1000);
 });
});

Answer 2

 $(document).ready(function(){
        $("#menu-item-67").hover(
            function(){
                $("#text-11").hide().fadeIn(1000);
            },

            function(){
               $("#text-11").fadeOut(1000);
             }
          );
   });