CODEWITHSUNDEEP
htmljquerycsstwitter-bootstrap
radscheit
radscheit

Reputation: 352

bootstrap collapsible is toggling out but not in

On my project here I have trouble with Bootstrap Collapsible.Please have a look at the screenshot.

download section.

The collapsibles are toggling out on click on the chevron icon as they should but they don't toogle in on the next click like in this Fiddle: 

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"/>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<a class="btn btn-primary" role="button" data-toggle="collapse" href="#collapseExample" aria-expanded="false" aria-controls="collapseExample">
  Link with href
</a>

<div class="collapse" id="collapseExample">
  <div class="well">
    ...
  </div>
</div>

I implemented this into my site pretty much the same way, like in the code snippet. What I've done wrong?

Thanks in advance.

Upvotes: 1

Views: 71

Answers (1)

Punit Gajjar
Punit Gajjar

Reputation: 4997

I found the problem, i have checked your page source.

you have included 

<script src="http://transgourmet-dev-static.transgourmet.plusline.net/sites/all/modules/jquery_update/replace/jquery/2.1/jquery.min.js?v=2.1.4"></script>

then after few scripts you have included again jquery 

<script src="http://transgourmet-dev-static.transgourmet.plusline.net/sites/all/themes/transgourmet/js/jquery-1.11.3.min.js?o1s650"></script>

i have just removed the first and and found your problem is resolved , but for some reason your other CSS part not shown well. so conclusion is you have jquery conflicts.

Upvotes: 3

Related Questions