jQuery 다른 하위 메뉴 항목 위로 마우스를 가져 가면 jQuery 하위 메뉴가 닫히지 않음

Question

내 메뉴는 호버 이벤트에서 작동하며 하위 메뉴를 가리키면 하위 메뉴가 열리지 만 다른 하위 메뉴를 가리키면 이전 하위 메뉴 메뉴의 자식은 스스로 닫아야합니다.

http://jsfiddle.net/samia/3N7BG/

Answer 1

당신은 이런 식으로 뭔가를 시도 할 수 있습니다 :

$(".topmenu .sub-menu .parent a").mouseover(function() { 
     if($(this).parent().attr('id') != $("li .open").attr('id') 
      && $(this).parent().has("ul").length > 0) { 
      if($("li .open").length > 0) { 
       $("li .open").children("ul").slideToggle(1000); 
       $("li .open").toggleClass("open"); 
      } 
      $(this).parent().children("ul").slideToggle(200); 
      $(this).parent().toggleClass("open"); 
     } 
}); 

이 방법에서 메뉴 slidingUp (예를 들어, 디자인) 메뉴보다 상당히 긴 경우 기억하십니까 내 작업 jsfiddle을 확인하시기 바랍니다 slidingDown (예 : 개발)을 선택하면 마우스가 '디자인'의 슬라이딩 업으로 인해 커버 된 영역을 벗어나기 때문에 '개발'이 슬라이드 업 될 수있는 상황이 발생합니다. 이를 테스트하려면 '디자인'메뉴에 다른 항목을 추가하기 만하면됩니다.

위의 구현 항목은 현재 잘 작동합니다.