Bootstrap 3 Skeleton

This is a simple Bootstrap skeleton. You can fork it to get a ready to use Bootstrap fiddle.

by Brunno Romero

HTML

<script src="http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.1.0/bootstrap.min.js"></script>
<div class="panel panel-warning">
  <div class="panel-heading">
    <h4 class="panel-title">
            <a data-toggle="collapse">SPOILER!</a>
        </h4>
  </div>
  <div class="panel-collapse collapse">
    <div class="panel-body">{SPOILER}</div>
  </div>
</div>

<div class="panel panel-warning">
  <div class="panel-heading">
    <h4 class="panel-title">
            <a data-toggle="collapse">SPOILER2!</a>
        </h4>
  </div>
  <div class="panel-collapse collapse">
    <div class="panel-body">{SPOILER2}</div>
  </div>
</div>

<div class="panel panel-warning">
  <div class="panel-heading">
    <h4 class="panel-title">
            <a data-toggle="collapse">SPOILER3!</a>
        </h4>
  </div>
  <div class="panel-collapse collapse">
    <div class="panel-body">{SPOILER3}</div>
  </div>
</div>

CSS

@import url('http://getbootstrap.com/dist/css/bootstrap.css');

JavaScript

$('a[data-toggle="collapse"]').click(function() {

  $(this)
    //Pega todos os elementos parent
    .parents()
    //Pega a prĂłxima div com a class .panel-collapse.collapse
    .next('div.panel-collapse.collapse')
    //e faz o collapse
    .collapse();
});