@hysryt/panel-switcher v1.0.2

PanelSwitcher

タブで切り替えするやつ

Peer Dependencies

• jquery@^3.3.1

使い方

window.$ = require('jquery');
require('@hysryt/panel-switcher');

HTML

<!-- PanelSwitcher -->
<div class="panelsw" data-anim="none">

  <!-- PanelSwitcher タブコンテナ -->
  <div class="panelsw_tab-container">
    <div class="panelsw_tab _active">タブ1</div>
    <div class="panelsw_tab">タブ2</div>
  </div>

  <!-- PanelSwitcher パネルコンテナ -->
  <div class="panelsw_panel-container">
    <div class="panelsw_panel _active">パネル1</div>
    <div class="panelsw_panel">パネル2</div>
  </div>

</div>

data-anim

フック

switch

パネル切り替え時のフック

$('#panelSwitcher').on('switch', function(event) {
  console.log('prev panel: ' + event.from);
  console.log('next panel: ' + event.to);
});