2011-01-11 9 views
0

나는 wordpress에서 하위 탐색을 만들고 중첩 목록 스타일 메뉴가 있습니다. HTML 예제는 다음과 같습니다. 현재 항목에 li 클래스 "current_page_item"이 있습니다. 부모 또는 자식 중 하나에 current_page_item 클래스가 없으면 축소 된 모든 자식 메뉴가 필요합니다. 작동하지만 내가 그것을 일부가 열려 깜박하고 다시 폐쇄가로 개선 될 수 있는지 궁금jQuery 열고 닫는 중첩 된 ul 탐색 위치에 따라

지금까지
<ul> 
<li class="current_page_item"><a href="#">Parent Item</a> 
    <ul class="children"> 
    <li><a href="#">Child page</a></li> 
    <li><a href="#">Child page</a></li> 
    <li><a href="#">Child page</a></li> 
    <li><a href="#">Child page</a></li> 
    </ul> 
</li> 
<li><a href="#">Parent Item</a> 
    <ul class="children"> 
    <li><a href="#">Child page</a></li> 
    <li><a href="#">Child page</a></li> 
    </ul> 
</li> 
<li><a href="#">Parent Item</a> 
    <ul class="children"> 
    <li><a href="#">Child page</a></li> 
    <li><a href="#">Child page</a></li> 
    </ul> 
</li> 
<li><a href="#">Parent Item</a></li> 
<li><a href="#">Parent Item</a></li> 
</ul> 

이를 ...

jQuery('ul.children').slideUp(); 
jQuery('li.current_page_item ul.children').slideDown('medium'); 
jQuery('li.current_page_item').parent().slideDown('medium'); 
+0

이 질문에 대한 게시글 http://www.stackoverflow.com – Sorantis

+1

애니메이션 속도'medium'이 없습니다 ... – clarkf

답변

1

당신이 물건을 위로 밀어하려는 경우 또는 아래로,하지만 모두 같은 것을 사용 : 당신은 모든 숨겨진 밖으로 시작하고 활성 요소를 아래로 슬라이드하려면,

// In one line: 
jQuery('ul.children').not(jQuery('ul.children:has(li.current_page_item), li.current_page_item ul.children').slideDown()).slideUp(); 

// In three more readable lines: 
var $active = jQuery('ul.children:has(li.current_page_item), li.current_page_item ul.children'); 
jQuery('ul.children').not($active).slideUp(); 
$active.slideDown(); 

을 또는이 사용

jQuery('ul.children').hide(); 
jQuery('ul.children:has(li.current_page_item), li.current_page_item ul.children').slideDown(); 

물론 jQuery 대신 $을 사용할 수도 있지만 귀하의 스타일을 고수 할 것입니다.