jQuery SubMenu 기회

Question

Ive는 밤새도록 아무런 소용이 없었습니다. 일반적인 SubMenu 질문 및 Ive는 여기에 비슷한 것들을 많이 읽었지만 어쩔 수없는 문제를 발견했습니다.

나는 순서가없는 목록 인 메뉴가 있습니다. 나는 또한 같은 하위 메뉴가 있습니다. 나는 메뉴를 잘 배치했다. 문제는 메뉴 1에서 메뉴 2로 마우스를 가져 가면 내 서브 메뉴가 내 일반 메뉴의 측면에 나타날 때 곧 사라진다는 것이다. 임 무언가 간단하지만 언젠가는 볼 수 있을까요?

<script> 
$(document).ready(function() { 
$('.nav').hover(function(e) { 
    if(!$('.nav2').is(':visible')) 
    { 
     $('.nav2').fadeIn('slow'); 
    } 
},function(){ 
    if(!$('.nav2').is(':hover')) 
    { 
     $('.nav2').fadeOut('slow'); 
    } 
}); 

$('.nav2').mouseout(function(){ 
    if(!$('.nav').is(':hover')) 
    { 
     $('.nav2').fadeOut('slow'); 
    } 
}); 
}); 
</script> 

그리고 내 목록은 다음과 같습니다

<div id="col1"> 

<ul class="nav"> 
<li><a href="http://www.alan.com">Home</a></li> 
<li><a href="http://www.alan.com">About</a></li> 
<li><a href="http://www.alan.com">New Listings</a></li> 
<li><a href="http://www.alan.com">Featured Home</a></li> 
<li><a href="http://www.alan.com">Town Facts</a></li> 
<li><a href="http://www.alan.com">Contact Me</a></li> 
</ul> 

<ul class="nav2"> 
    <li><a href="http://www.alan.com">Bio</a></li> 
    <li><a href="http://www.alan.com">Credentials</a></li> 
    <li><a href="http://www.alan.com">Education</a></li> 
    </ul> 

</div> 

Answer 1

둥지 메인 메뉴에 li에 하위 메뉴.

<div id="col1"> 
    <ul class="nav"> 
     <li><a href="http://www.alan.com">Home</a></li> 
     <li><a href="http://www.alan.com">About</a> 
      <ul class="nav2"> 
       <li><a href="http://www.alan.com">Bio</a></li> 
       <li><a href="http://www.alan.com">Credentials</a></li> 
       <li><a href="http://www.alan.com">Education</a></li> 
      </ul> 
     </li> 
     <li><a href="http://www.alan.com">New Listings</a></li> 
     <li><a href="http://www.alan.com">Featured Home</a></li> 
     <li><a href="http://www.alan.com">Town Facts</a></li> 
     <li><a href="http://www.alan.com">Contact Me</a></li> 
    </ul> 
</div> 

편집 : 같은 뭔가 이것은 당신에게 몇 가지 아이디어를 제공해야합니다. - jsFiddle Demo