Tabtastic

A

AlbertPacino

Skilled
This library is a simple way to implement tabs on your page using CSS, a little JS, and semantic markup which degrades gracefully on browsers with CSS unavailable or disabled.

Not only is it easy to use and accessible for screen-readers, but it supports multiple (nested, even) tabsets on the same page and allows users to bookmark the page loading to a specific tab.

Here's some sample markup:

<ul class="tabset_tabs">
[*]Tab 1
[*]Tab 2
[*]Tab 3
[/list]

<div id="tab1">
<h2 class="tabset_label">Tab 1</h2>
Tab 1 Content
</div>

<div id="tab2">
<h2 class="tabset_label">Tab 2</h2>
Tab 2 Content
</div>

<div id="tab3">
<h2 class="tabset_label">Tab 3</h2>
Tab 3 Content
</div>
Click to expand...
It's that easy! (As long as you include the files listed in the Requirements section.)

Source
 
Back
Top