Сделать первый элемент навигации закрытым в меню аккордеона

Я сделал этот урок:

http://michaeljacobdavis.com/tutorials/statesavingaccordion.html вот демонстрационная страница: http://michaeljacobdavis.com/tutorials/statesavingaccordion/statesavingaccordion.html#1

Я подключил его просто отлично, но я не хочу, чтобы первый пункт меню открывался (о программе), когда пользователь посещает сайт в первый раз. Я хочу, чтобы все элементы главного меню были закрыты, чтобы пользователь не мог видеть элементы вспомогательной навигации, пока они не нажмут на один из них. Я пытался, но не мог понять, как это сделать - пожалуйста, помогите. Ниже приведен код — раздел «О программе» всегда открывается при первом открытии сайта — я бы хотел, чтобы он был закрыт.

<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>

jquery jquery-ui-accordion
person user1269988    schedule 17.04.2012    source источник

Ответы (2)


arrow_upward
2
arrow_downward

Это должно работать:

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

arrow_upward
1
arrow_downward

Привет Демо :) 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;

     });    


});​
person Tats_innit    schedule 17.04.2012
comment
@user1269988 user1269988 не беспокойтесь, чувак, все хорошо, пожалуйста, не забудьте принять ответ, упомянув вас, поскольку вы кажетесь новичком, спасибо! - person Tats_innit; 17.04.2012