jQuery

【jQuery】美しいコンテンツタブを作成するための軽量なjQueryプラグインContent Tabs

February 10, 2018
CONTENT TABS

Content Tabsは美しいコンテンツタブを作成するための小型で軽量なjQueryプラグイン。

Setup HTML

  <div id="contentTabs">
    <div class="contentTabs--header">
      <div class="tab-header active">Design</div>
      <div class="tab-header">Coding</div>
    </div>
    <div class="contentTabs--content">
      <div class="tab-content active">
      </div>
      <div class="tab-content">
      </div>
    </div>
  </div>

Link CSS, JS and jQuery

  <link rel="stylesheet" href="path/to/contentTabs.css">
  <script type="text/javascript" src="path/to/jQuery.js"></script>
  <script type="text/javascript" src="path/to/contentTabs.js"></script>

Call function on parent element

  $("#contentTabs").contentTabs();