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

Question

请帮忙;我正在开发一个网站，我希望在mouseenter和mouseleave上有一个fadeIn和fadeOut的图像。

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

请查看上图。这是当mouseenter和fadeIn效果一起出现的状态。所以fadeIn工作很酷，但淡出没有效果！我正在使用以下代码来实现这一目标：

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

    
    $(document).ready(function(){
        $("#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);
             }
          );
   });