jtabsはjQueryを使用したタブプラグイン。

<div id="my-tabs" class="jtabs">
<!-- tabs navigation -->
  <div class="jtabs-nav">
  <ul>
    <li data-name="tab-1">Tab 1</li>
    <li data-name="tab-2">Tab 2</li>
    <li data-name="tab-3">Tab 3</li>
  </ul>
  </div>
			
<!-- tabs content -->
  <div class="jtabs-content">
  <!-- tab 1 -->
    <div class="jtab" data-name="tab-1">
      <div class="jtab-inner">
      Tab 1 Content
      </div>
    </div>
				
<!-- tab 2 -->
    <div class="jtab" data-name="tab-2">
      <div class="jtab-inner">
      Tab 2 Content
      </div>
    </div>
				
<!-- tab 3 -->
    <div class="jtab" data-name="tab-3">
      <div class="jtab-inner">
      Tab 3 Content
      </div>
    </div>
  </div>
</div>
		
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<script src="../jtabs.js"></script>
<script>
$('#my-tabs').jtabs();
</script>

MIT
Demo/Download

• Tag
• jQuery
• Tab