2010-03-30 4 views
0

나는이 HTML 메뉴가 있습니다바로 하위 UL 부모 UL 메뉴의 표시

 <ul id='main'> 
     <li class='active current' id='lighty'> 
      <a href='/'>Lighty</a> 
      <ul> 
      <li class='sub'> 
       <a href='/'>Hem</a> 

      </li> 
      </ul> 
     </li> 
     <li id='community'> 
      <a href='/community'>Community</a> 
     </li> 
     </ul> 

그리고이 jQuery를 :

 $("#menu ul > li").mouseenter(function(){ 
     id = $(this).attr("id"); 
     $("#menu #main li").removeClass("active"); 
     $(this).addClass("active"); 
     }).mouseleave(function(){ 
     id = $(this).attr("id"); 
     menu.timers[id] = setTimeout(function(){$("#menu #main li#"+id).removeClass("active");}, 2000); 
     }); 

내가 뭘 acomplish을 시도하고있다가 내가 중 하나를 가져 가면 리의 주 아이는 그 아이의 아이를 표시해야합니다. li 또는 child ul에서 마우스를 움직일 때 메뉴가 2 초 동안 표시되어야합니다. 그것은 주요 li 단추를 통해 작동하지만 자식 ul 및 이동 그냥 disapears 경우 2 초 기다리지 않습니다.

우연히 마우스를 빠져 나오면 기다릴 수있는 2 초입니다.

누구든지이 오류를 해결할 수 있도록 도와 줄 수 있습니까? 어쩌면 당신은 더 나은 해결책이 있을까요? screen shot under or click hereScreenshot http://img42.imageshack.us/img42/813/screenshotar.png

답변

1

이 당신이 무슨 뜻인지입니다 : 여기

도 도움이된다면 메뉴가 보이는 방법에 대한 스크린 샷입니다?

<script type="text/javascript" src="jquery.js"></script> 
<script type="text/javascript"> 
<!-- 
$(function() { 
    $("ul#main > li").mouseenter(function(){ 
     $("#main li").removeClass("active"); 
     $(this).addClass("active"); 
    }).mouseleave(function(){ 
     setTimeout(function() 
     { 
      $("#main li").removeClass("active"); 
     }, 2000); 
    }); 
}); 
//--> 
</script> 
<style type="text/css"> 
    #main li ul { 
     display: none; 
    } 
    #main li.active ul { 
     display: inline; 
    } 
</style> 

<ul id="main"> 
    <li id="lighty"> 
     <a href="/">Lighty</a> 
     <ul> 
      <li class="sub"> 
       <a href="/">Hem</a> 
      </li> 
     </ul> 
    </li> 
    <li id="community"> 
     <a href="/community">Community</a> 
     <ul> 
      <li class="sub"> 
       <a href="/">more</a> 
       <a href="/">more1</a> 
       <a href="/">more2</a> 
       <a href="/">more4</a> 
      </li> 
     </ul> 
    </li> 
</ul> 
+0

정확히 그랬습니다! 고마워 – Lisinge