Jquery 메뉴가 마우스 왼쪽에 숨어 있지 않음

Question

다음 메뉴가 있습니다 (이는 드롭 다운 메뉴를 표시해야하는 아이콘 일뿐입니다. 토글로 표시하고 숨길 메뉴를 얻을 수 있지만, 내가 링크를 닫으면 표시된 링크로 이동하려고하면 클래스를 추가 할 때 마우스를 올리면 메뉴가 사라집니다. 마우스를 클릭하여이 메뉴를 부드럽게 표시하고 숨길 수있는 방법이 있습니까?

<div id="global_menu"> 
     <span id="show_global_menu" class="icons_large">(</span> 
      <ul id="dropdown" class="hidden"> 
       <span class="arrow-u" style="margin-top:-8px;"></span> 
       <li> @Ajax.ActionLink("Icon Legend", "font_legend", null, new AjaxOptions {   UpdateTargetId = "placeholder_extra1", InsertionMode = InsertionMode.Replace, HttpMethod = "GET" }, new { @class = "" })</li> 
       <li><a href="../Home/Index" title="Sign Out">Sign Out</a></li> 
       <li>Support</li> 
      </ul> 
</div> 
    <script> 
     $(document).ready(function() { 
      if ($("ul#dropdown").hasClass("hidden")) { 
       $("span#show_global_menu").hover(function() { 
        $("ul#dropdown").slideDown("slow"); 
       }); 
      }; 
     $("ul#dropdown").hover(function(){ 
      $("ul#dropdown").mouseout(function() { 
       $("ul#dropdown").addClass("hidden"); 
      }); 
     }); 
     }); 
</script>  

Answer 1

를 사용

<script> 
    $(document).ready(function() { 
     if ($("ul#dropdown").hasClass("hidden")) { 
      $("span#show_global_menu").hover(function() { 
       $("ul#dropdown").slideDown("slow"); 
      }); 
     }; 

     $("ul#dropdown").mouseleave(function() { 
      $("ul#dropdown").slideUp('slow'); 
     }); 
    }); 
</script> 

Answer 2

는 다음과 같이 somesing보십시오 : $ (문서) .ready (함수() {

$("span#show_global_menu").hover(function() { 
    $("ul#dropdown").slideDown("slow"); 
},function(){ 
     $("ul#dropdown").slideUp("slow"); 
}); 


     }); 
</script>