2011-04-25 2 views
0

다른 질문이 있습니다. PHP 또는 jQuery를 통해 수행 할 수 있는지 확실하지 않으므로 두 섹션 모두에 게시하고 있습니다.jQuery 또는 PHP - 다른 DIV가 활성화/비활성화 된 경우 DIV 또는 LI 표시/숨기기

기본적으로 내가 원하는 것은 이것이다 :

내가 4 명 div의라는 제목 "봄", "여름", "가을"과 "겨울"을 포함하여 한 페이지에 여러 된 div 보유하고 있습니다.

"메뉴"라고하는 다른 DIV가 있습니다. 메뉴에서 jQuery를 통해 네 개의 시즌 DIV 각각을 토글 할 수 있습니다. 또한 "Ice Rinks"및 "Ice Cream Stores"와 같은 몇 가지 목록 항목이 있습니다. "Ice Rinks"는 "Winter"를 선택한 경우에만 사용할 수 있고 Summer를 선택하면 "Ice Cream Stores"를 사용할 수 있습니다.

"Winter"DIV가 활성화되면 jQuery를 통해 "Ice Cream Stores"를 숨기거나 "Summer"DIV를 활성화하면 "Ice Rinks"를 숨길 수 있습니다.

기본적으로 selectivly 또는 동적으로 (아마도 목록 항목의 클래스를 통해) 메뉴 항목을 4 Season DIVS 중 하나에 할당하고 관련 계절이 표시 될 때 Menu에서 해당 항목을 숨길 수있는 방법이 필요합니다. DIV가 해제됩니다.

가능합니까? 그렇다면 누구에게 이것이 달성 될 수있는 코드 예가 ​​있습니까?

감사 자크

+0

당신이 당신의 HTML 코드를 추가 할 수 있습니다

$(document).ready(function(){ $('.menubtn').click(function(){ // Handle Menu $('.menubtn').removeClass('active') $(this).addClass('active'); // Handle item list. This is what you want to do $('#itemlist li').hide(); $('#itemlist li.' + $(this).attr('id')).show(); }); }); 

당신은 여기에서 데모를 볼 수 있습니까? – Phliplip

+0

여기 - http://jsfiddle.net/vDxRC/ – stealthyninja

답변

2

그것은 가능합니다.

<div id="spring" class="menubtn">Spring</div> 
<div id="summer" class="menubtn">Summer</div> 
<div id="autumn" class="menubtn">Autumn</div> 
<div id="winter" class="menubtn">Winter</div> 
<ul id="itemlist"> 
    <li class="winter">Ice Rinks</li> 
    <li class="summer">Ice Cream Stores</li> 
</ul> 

자바 스크립트 :이

HTML처럼 할 수 http://jsfiddle.net/ynhat/Cgeus/3/

관련 문제