css - Button in a clickable header -

css - Button in a clickable header -

i have collapse tabs collapse when click in header, ok, if click in link @ end of each header shouldn't collapse it, should run link action. possible?

http://plnkr.co/edit/adp8iov9vqkvrroh2mk9?p=preview

<div class="accordion" id="accordion" > <div class="accordion-group"> <div class="accordion-heading" data-toggle="collapse" data-target="#collapseone" href="#" style="padding: 10px;"> <div class="pull-right"><a href="#">link 1</a></div> item #1 </div> <div id="collapseone" class=" collapse in"> <div class="accordion-inner"> anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson advertisement squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. nutrient truck quinoa nesciunt laborum eiusmod. brunch 3 wolf moon tempor, sunt aliqua set bird on squid single-origin coffee nulla assumenda shoreditch et. nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. advertisement vegan excepteur butcher vice lomo. leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt haven't heard of them accusamus labore sustainable vhs. </div> </div> </div> <div class="accordion-group"> <div class="accordion-heading" data-toggle="collapse" data-target="#collapsetwo" href="#" style="padding: 10px;"> <div class="pull-right"><a href="#">link 2</a></div> item #2 </div> <div id="collapsetwo" class=" collapse"> <div class="accordion-inner"> anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson advertisement squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. nutrient truck quinoa nesciunt laborum eiusmod. brunch 3 wolf moon tempor, sunt aliqua set bird on squid single-origin coffee nulla assumenda shoreditch et. nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. advertisement vegan excepteur butcher vice lomo. leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt haven't heard of them accusamus labore sustainable vhs. </div> </div> </div> <div class="accordion-group"> <div class="accordion-heading" data-toggle="collapse" data-target="#collapsethree" href="#" style="padding: 10px;"> <div class="pull-right"><a href="#">link 3</a></div> item #3 </a> </div> <div id="collapsethree" class=" collapse"> <div class="accordion-inner"> anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson advertisement squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. nutrient truck quinoa nesciunt laborum eiusmod. brunch 3 wolf moon tempor, sunt aliqua set bird on squid single-origin coffee nulla assumenda shoreditch et. nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. advertisement vegan excepteur butcher vice lomo. leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt haven't heard of them accusamus labore sustainable vhs. </div> </div> </div> </div>

you need stop click event on "a" element propagating parent (the accordion heading) trigger collapse.

this piece of jquery trick:

$('.accordion-heading a').click(function(e){ e.stoppropagation(); })

css twitter-bootstrap