I am having a problem that is similar, but not the same as MMOne. It
is in an faq page. There are 2 tabs, one for each type of product. I
am using jQuery UI tab for the tabs.
I am trying to use accordion inside of the divs controlled by tab. I
set the header for accordion to be a dt, so that the dd expands when
the dt is clicked, showing the answer to that faq. I close the dl with
the class of accordion within each tab. When I go to the second tab,
there is an inline height: 0 on the dd that should be open by default,
and even when I click another dt, the dd does not expand.
How do I use accordion inside of tab? This is the code I have
$(document).ready(function() {
$('#tabs').tabs();
$(".accordion").accordion({ header: "dt"});
});
<div id="tabs">
<h1>Frequently Asked Questions</h1>
<ul>
<li><a href="#tabs-1">prod 1</a></li>
<li><a href="#tabs-2">prod 2</a></li>
</ul>
<div id="tabs-1">
<h2>lorem ipsum</h2>
<dl class="accordion">
<dt>first question</dt>
<dd>first answer</dd>
<dt>second question</dt>
<dd>second answer</dd>
</dl>
</div>
<div id="tabs-2">
<h2>lorem ipsum</h2>
<dl class="accordion">
<dt>first question</dt>
<dd>first answer</dd>
<dt>second question</dt>
<dd>second answer</dd>
</dl>
</div>
</div>
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"jQuery UI" group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to
[email protected]
For more options, visit this group at
http://groups.google.com/group/jquery-ui?hl=en
-~----------~----~----~----~------~----~------~--~---
