Twitter's Bootstrap framework uses Tabs
and Tab content
.
Usually from an html/css/js coding point of view:
<ul class="tabs">
<li class="active"><a href="#home">Home</a></li>
<li><a href="#profile">Profile</a></li>
<li><a href="#messages">Messages</a></li>
<li><a href="#settings">Settings</a></li>...
</ul>
<div class="tab-content">
<div class="active" id="home">...</div>
<div id="profile">...</div>
<div id="messages">...</div>
<div id="settings">...</div>
</div>
<script>
$(function () {
$('.tabs').tabs()
})
</script>
Taken from the Bootrstrap framework (although they call it pill-content
because of some lazy copy-paste from the pills navigation). Something similar is used in the jQuery UI Tabs.