mootools fx.Аккордовский контент по какой-то причине не отображается

Question

Я новичок в MooTools и пытаюсь реализовать плагин fx.Accordian.

Я включил MooTools, а также плагин Accordian.Я действительно не пытаюсь сделать что-то сильно отличающееся от того, что показано в демоверсии с сайта MooTools.

В моем CSS я вставил:

#accordion  {
  margin: 20px 0 0;
  max-width: 400px;
}

#accordion H2 {
    background: #99ccff;
    color: black;
    cursor: pointer;
    font-size: 10pt; 
    font-family: Helvetica, Arial, sans-serif; 
    text-align: left;
    font-weight: bold;
    line-height: 16px;
    margin: 0 0 4px 0;
    padding: 3px 5px 1px;
  }

#accordion .accordion_content {
    background-color: #F4F5F5;
}

#accordion .accordion_content p {
    margin: 0.5em 0;
    padding: 0 6px 8px 6px;
}

Внутритег script в моем заголовочном файле:

window.addEvent('domready', function(){
   new Fx.Accordion($('accordion'), '#accordion h2', '#accordion .accordion_content');
});

И затем я пытаюсь сделать что-то вроде следующего в HTML:

<div id='accordion' class='customized'>
<h2>What not #1</h2>
<div class='accordion_content'>
    <p>What not #1 is being displayed now</p>
</div>
</div>

Я получаю аккордеон H2, отображаемый правильнооднако, когда я нажимаю на него, аккордеонный контент не отображается.Может кто-нибудь помочь мне понять, почему это не работает?

Answer 1

В вашем коде нет ничего плохого, все, что вам нужно сделать, это добавить больше аккордеонных разделов в ваш html. Из документации:

"Класс Fx.Accordion создает группу элементов, которые переключаются при щелчке их ручек. Когда один элемент переключается в поле зрения, остальные переключаются. "

Таким образом, аккордеон с одним элементом не имеет особого смысла - будучи единственным, он всегда будет активным элементом независимо от того, что вы делаете.

Я добавил еще один <h2> переключатель и другой контент <div> к вашему исходному коду, и он отлично работает. Смотри http://jsfiddle.net/YayQD/1/