Accordion with a link to external resource

accordion, twitter-bootstrap

Solution

Forked to http://jsfiddle.net/ZPLff/

changes :

<a href="http://www.google.com" target="_blank" id="google">

$("#google").click(function(e) {
    e.stopPropagation();
});​

reason : `data-toggle="collapse"` (in collapsible data-api) calls `e.preventDefault()` in its `.on.click()`-handler, so you have to prevent this

Problem

I am trying to have an accordion with whole header DIV clickable which also includes a link which does not influence accordion status but instead open an external link in new a tab/windows. but if I do this, header is capturing click event on my link and it toggles accordion status only. Example code: ``` <div class="accordion" id="accordion2"> <div class="accordion-group"> <div class="accordion-heading accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseOne"> <a href="http://www.google.com" target="_blank"> Collapsible Group Item #1 </a><br /> whole heder is<br /> clickable<br /> </div> <div id="collapseOne" class="accordion-body collapse in"> <div class="accordion-inner"> Anim pariatur cliche... </div> </div> </div> </div> ``` http://jsfiddle.net/LUzwP/6/ is it at all possible to implement?

Original source