CODEWITHSUNDEEP
javascriptjqueryhtmltwitter-bootstraphyperlink
Alexis Cofion
Alexis Cofion

Reputation: 83

HTML Links within Bootstrap collapse not working

I am pretty new with JS and therefore believe the problem comes from this part.

The links that are being toggled/collapsed with the bootstrap JS don't "work" properly : when clicking on them, the page isn't followed. However, when right-clicking and opening in a new tab/window no problem. Ctrl-click also doesn't work.

Here the second link works but not the first one.

Here is the html :

<a class = "carre" data-toggle = "collapse" data-target = "#link"></a>
<div data-toggle = "collapse" class ="panel-collapse collapse" id = "link">
<a href = "http://www.google.com" >link</a>
</div>
<br>
<br>
<a href = "http://www.google.com" >link</a>

And CSS :

.carre{
    display: inline-block;
    padding: 15px;
    background-color: black;
    font-size: 1.5em;
    border-radius: 4px;
    border: 1px solid #FFFFFF;
    margin-bottom:15px:
}

Here is the link to an example JSFiddle : http://jsfiddle.net/t7mpv6vk/

Upvotes: 2

Views: 6784

Answers (1)

ketan
ketan

Reputation: 19341

Here i got solution for your problem:

Check updated Fiddle here: Fiddle

Write onClick="event.stopPropagation();" in div.

like: <div data-toggle = "collapse" class ="panel-collapse collapse" id = "link">

Because When your click on link. div will get the click event instead of link.

Upvotes: 2

Related Questions