I've successfully implemented an accordion as outlined here, but would like to wrap each section in a div, so my structure would be as follows:
<div id="accordion">
<div class="wrap">
<h3><a href="#">Header 1</a></h3>
<div>Collapsible content 1</div>
</div><!-- end wrap -->
<div class="wrap">
<h3><a href="#">Header 2</a></h3>
<div>Collapsible content 2</div>
</div><!-- end wrap -->
<div class="wrap">
<h3><a href="#">Header 3</a></h3>
<div>Collapsible content 3</div>
</div><!-- end wrap -->
</div>
Is this possible using the accordion functionality provided in jQuery UI? As of now, if I try to build it this way, it attempts to treat the <div class="wrap">
as the section header.
Changing the header option seems alright.
http://jqueryui.com/demos/accordion/#option-header
$(function() {
$( "#accordion" ).accordion(
{ header: '> div.wrap > h3' }
);
});
http://jsfiddle.net/Quincy/RCXwz/
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With