Accessible semantic jQuery tabs plugin
- by user249950
Hello,
Just a quick question to see if anyone knows of any jquery tabs plugins that run based on a similar structure to:
<div class="tabs">
<div>
<h4>Tab one</h4>
<p>Lorem Ipsum</p>
</div>
<div>
<h4>Tab two</h4>
<p>Lorem Ipsum</p>
</div>
</div>
Where the plugin grabs the title of the tabs from the h4s? I can only seem to find plugins that use the structure:
<div id="tabs">
<ul>
<li><a href="#tabs-1">Nunc tincidunt</a></li>
<li><a href="#tabs-2">Proin dolor</a></li>
<li><a href="#tabs-3">Aenean lacinia</a></li>
</ul>
<div id="tabs-1">
<p>Tab 1 content</p>
</div>
<div id="tabs-2">
<p>Tab 2 content</p>
</div>
<div id="tabs-3">
<p>Tab 3 content</p>
</div>
</div>
I assume the only other way to use these plugins would be to grab the titles, remove them, add them into a list at the top of the html and then run the plugin based on that? I just ask as I am quite new to jQuery so I'm not sure how I would go about it and just wondered if there was a plugin already in existence that anyone knew of.
If not, not to worry, I'll have to get busy with the docs and give it a go!
Cheers
