Tabs
v1.0.0
Tabs make it easy to explore and switch between different views.
Default
Tab 1
Tab 2
Tab 3
Tab 4
Tab Five
Content Tab 1
Content Tab 2
Content Tab 3
Content Tab 4
Content Tab Five
<div class="tabs">
<div class="tab active">Tab 1</div>
<div class="tab">Tab 2</div>
<div class="tab">Tab 3</div>
<div class="tab">Tab 4</div>
<div class="tab">Tab Five</div>
</div>
<div class="tab-contents">
<div class="tab-content active">Content Tab 1</div>
<div class="tab-content">Content Tab 2</div>
<div class="tab-content">Content Tab 3</div>
<div class="tab-content">Content Tab 4</div>
<div class="tab-content">Content Tab Five</div>
</div>Add Interactivity
By adding a bit of Javascript we can add some interactivity to our tabs. Now every tab is clickable and selects it´s tab content.
Tab 1
Tab 2
Tab 3
Tab 4
Tab Five
Content Tab 1
Content Tab 2
Content Tab 3
Content Tab 4
Content Tab Five