아코디언 메뉴 폐쇄 최초의 탐색 항목을 시작 확인

Question

나는이 튜토리얼했다

: 여기

http://michaeljacobdavis.com/tutorials/statesavingaccordion.html

데모 페이지입니다 : http://michaeljacobdavis.com/tutorials/statesavingaccordion/statesavingaccordion.html#1

내가 잘 그것을 중독,하지만 난 싶지 않아을 첫 번째 메뉴 항목 사용자가 사이트를 처음 방문 할 때 열립니다 (정보). 사용자가 하위 탐색 항목을 클릭 할 때까지 하위 메뉴 항목을 볼 수 없도록 모든 기본 메뉴 항목을 닫아야합니다. 시도했지만 시도하는 방법을 알아 내지 못했습니다. 도와주세요. 아래는 코드입니다. About 섹션은 사이트가 처음 열릴 때 항상 열리고 닫히고 싶습니다.

<script type="text/javascript"> 
jQuery().ready(function(){ 
$('#navbar').accordion({ 
    autoHeight: false, 
    navigation: true, 
    header: '.navbaritem' 
}); 

$(".navbaritem").click(function(event){ 
     window.location.hash=this.hash; 
});  
}); 
</script> 

    <div id="navbar"> 
<div id="logo"> <a href="index.html"><img src="images/logo.png" width="234" height="191" border="0" /></a></div>  
<div class="navitemback"> 
<a class="navbaritem" href="#about" title="First Menu Item" name="about">about</a> 
<div> 
    <p><a href="#why">why we do it</a></p> 
    <p><a href="#press">press/awards</a></p> 
    <p><a href="#bio">bio</a></p> 
</div> 
</div> 

<div class="navitemback"> 
<a class="navbaritem" href="#commercial" title="Second Menu Item" name="commercial">commercial</a> 
<div> 
    <p><a href="#olivers">olivers</a></p> 
    <p><a href="#lemonade">lemonade</a></p> 
    <p><a href="#court">court</a></p> 
    <p><a href="#macks">macks</a></p> 
</div> 
</div> 

<div class="navitemback"> 
<a class="navbaritem" href="#residential" title="Third Menu Item" name="residential">residential</a> 
    <div> 
    <p><a href="#city">city</a></p> 
    <p><a href="#states">states</a></p> 
    <p><a href="#country">country</a></p> 
</div> 
</div> 

Answer 1

이 작동합니다 :

$('#navbar').accordion({ 
    autoHeight: false, 
    navigation: true, 
    header: '.navbaritem', 
    active: false, 
    collapsible: true 
}); 

Answer 2

안녕 데모 : http://jsfiddle.net/aCeyn/

또한이 같은 collapsible없이이 작업을 수행 할 수 있습니다이 도움이

희망! 좋은 것을 가지고, 환호! http://michaeljacobdavis.com/tutorials/statesavingaccordion/jquery-ui.min.js

오, 또한 당신은 jsfiddle 함께 놀러와 사용에 스타일을 넣어 주시기 수 있습니다 : 다른 속성이나 코드를 읽으려면 더 경우

여기보세요!

JQuery와 코드

$(document).ready(function(){ 
    $('#testMenu').accordion({ 
     autoHeight: false, 
     navigation: true, 
     header: '.testMenuItem', 
     active: false 
    }); 

    $(".testMenuItem").click(function(event){ 
      window.location.hash=this.hash; 

    });  


});​