Twitter Bootstrap のアコーディオンが折りたたまれて展開されたときに、弾丸の変更/スワップを行いたいと考えています。箇条書きの背景画像を使用しました。
現在、この jsfiddle、http://jsfiddle.net/fBd4a/10/では、ページが読み込まれると、適用される箇条書きは「-」です。ただし、アイテムが展開されて折りたたまれた後、「+」の箇条書きが保持されます。最初から「+」の箇条書きをお願いします。
ありがとう。
@import url('http://twitter.github.com/bootstrap/assets/css/bootstrap.css');
.container {
margin-top: 10px;
}
.accordion .accordion-group .accordion-heading a.accordion-toggle.collapsed {background: #e9e8e8 url(http://i.imgur.com/pdB4oDz.png) no-repeat 0 11px;}
.accordion .accordion-group .accordion-heading a.accordion-toggle {background: #e9e8e8 url(http://i.imgur.com/9zfyr43.png) no-repeat 0 20px;}
<div class="accordion" id="accordion2">
<div class="accordion-group">
<div class="accordion-heading">
<a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseOne">
Collapsible Group Item #1
</a>
</div>
<div id="collapseOne" class="accordion-body collapse">
<div class="accordion-inner">
Anim pariatur cliche...
</div>
</div>
</div>
<div class="accordion-group">
<div class="accordion-heading">
<a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseTwo">
Collapsible Group Item #2
</a>
</div>
<div id="collapseTwo" class="accordion-body collapse">
<div class="accordion-inner">
Anim pariatur cliche...
</div>
</div>
</div>
</div>
<script src="http://twitter.github.io/bootstrap/assets/js/bootstrap-collapse.js"></script>