<div class="accordion" id="my_accordion">
<section class="accordion-group">
<!-- Accordion heading (clickable area that reveal the content) -->
<div class="accordion-heading">
<a href="#acc1" class="accordion-toggle" data-toggle="collapse" data-parent="#my_accordion">Title 1</a>
</div>
<!-- Content -->
<div id="acc1" class="accordion-body collapse">
<section class="accordion-inner">
<p>Content 1 goes here</p>
</section>
</div>
<!-- Repeat -->
<div class="accordion-heading">
<a href="#acc2" class="accordion-toggle" data-toggle="collapse" data-parent="#my_accordion">Title 2</a>
</div>
<div id="acc2" class="accordion-body collapse">
<section class="accordion-inner">
<p>Content 2 goes here</p>
</section>
</div>
<div class="accordion-heading">
<a href="#acc3" class="accordion-toggle" data-toggle="collapse" data-parent="#my_accordion">Title 3</a>
</div>
<div id="acc3" class="accordion-body collapse">
<section class="accordion-inner">
<p>Content 3 goes here</p>
</section>
</div>
</section>
</div>
<script>
// Open first content on load (optional)
// In some pages you might want more than one panels open
$("#acc1.accordion-body").addClass("in");
</script>
Be the first to comment
You can use [html][/html], [css][/css], [php][/php] and more to embed the code. Urls are automatically hyperlinked. Line breaks and paragraphs are automatically generated.