Skip to main content
1 of 2
Naoise Golden
  • 4.4k
  • 25
  • 28

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.

Naoise Golden
  • 4.4k
  • 25
  • 28