I have been trying to implement an accordion menu using twitter and following the example , also spent my day googling but no fix so far.
Basically I have a weird behaviour while clicking on the menu items :
clicking on the item A and then the item B result in leaving the item A still open - the same happens by clicking on other items - all of them remain opened
here is the code :
<div class="panel-heading"></div>
<li class="list-group-item accordion-toggle" data-target="#elementOne" data-toggle="collapse" data-parent="#accordion">
<a class="accordion-toggle">Test 1</a>
<div id="elementOne" class="collapse">
<ul class="list-group">
<li class="list-group-item">
<a href="some_url.html">link1</a>
</li>
</ul>
</div>
</li>
<li class="list-group-item accordion-toggle" data-target="#elementTwo" data-toggle="collapse" data-parent="#accordion">
<a class="accordion-toggle">Test 2</a>
<div id="elementTwo" class="collapse">
<ul class="list-group">
<li class="list-group-item">
<a href="some_url.html">link2</a>
</li>
</ul>
</div>
</li>
pls help !!
There is a Bootstrap "issue" where the data-parent
is dependent on the panel
class:
https://github.com/twbs/bootstrap/pull/11191
So you could get it work be adding the panel
class to each item..
or there may be some jquery workaround as well.