Question

160

Bootstrap Collapse not Collapsing

rated 0 times [ 165] [ 5] / answers: 1 / hits: 193563 / 10 Years ago, wed, april 9, 2014, 12:00:00

I am trying to create a collapsable component using Bootstrap. My code is this

<link rel=stylesheet href=http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css>

<script src=http://netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js></script>



<div class=panel-group id=accordion>

  <div class=panel panel-default>

    <div class=panel-heading>

      <h4 class=panel-title>

        <a data-toggle=collapse data-parent=#accordion href=#collapseOne>

      Collapsible Group Item #1

    </a>

      </h4>

    </div>

    <div id=collapseOne class=panel-collapse collapse in>

      <div class=panel-body>

        Anim pariatur cliche reprehenderit

      </div>

    </div>

  </div>

</div>

The "Collapsible Group Item #1" when clicked should collapse the items in class "panel-body" but it doesn't there is no effect of click. I copied this code directly from Bootstrap documentation still it does not work. Can anyone figure out what is the problem?

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

jesse

Add To Favorites

Follow

Total Points: 513

Total Questions: 118

Total Answers: 106

Location: Denmark

Member since Tue, Jul 19, 2022

2 Years ago

answered 10 Years ago micayla · Accepted Answer

jQuery is required (if you're using Bootstrap 3 or 4) ;-)

<html>

<head>

    <link rel=stylesheet href=http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css>

    <!-- THIS LINE -->

    <script src=//code.jquery.com/jquery-1.11.0.min.js></script>

    <script src=http://netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js></script>

</head>

<body>



<div class=panel-group id=accordion>

    <div class=panel panel-default>

        <div class=panel-heading>

            <h4 class=panel-title>

                <a data-toggle=collapse data-parent=#accordion href=#collapseOne>

                    Collapsible Group Item #1

                </a>

            </h4>

        </div>

        <div id=collapseOne class=panel-collapse collapse in>

            <div class=panel-body>

                Anim pariatur cliche reprehenderit

            </div>

        </div>

    </div>

</div>



</body>

</html>