Touch-Tabs-jQuery

JavaScript

イベントやカスタマイズが可能な拡張性の高いタブシステム「Touch-Tabs-jQuery」

Touch-Tabs-jQueryは、イベント設定やカスタマイズが可能な拡張性の高いタブシステムを実装することができます。PCでのドラッグ操作やスマホでのタッチ操作から、タブの順番を入れ替えるといったことも可能です。

Touch-Tabs-jQuery

デモ

デモページでは、4つのタブ項目を備えたタブパネルが表示されています。上部にあるタブをクリックしたりタップしたりすることで、そのタブに応じたコンテンツがパネル内に表示されます。

また、PCからはドラッグ操作で、モバイル端末からはタッチ操作でタブの順番を入れ替えることもできます。

選択中のタブは非選択タブとは異なるカラーになるので、現在どのタブが選ばれているのかを瞬時に把握できます。デザイン・レイアウトともにシンプルで操作性もよく、サクサクとタブを切り替えることが可能です。

また、イベントにはtabcreate、tabactivate、tabcloseといったものが用意されています。tabcreateはタブが作成された時、tabactivateはタブクリックでアクティブになった時もしくは現在アクティブなタブを閉じることでアクティブになった時、tabcloseはJavaScriptまたはユーザーがクローズボタンをクリックした時に、イベントがトリガーされます。

Touch-Tabs-jQuery

no-image依存関係のないタグ付け機能を実装できる「taggle.js」前のページ

テーブルにソート(並べ替え)機能を実装できる「tsorter」次のページtsorter

最近の記事

  1. ホワイトチョコマカダミアドーナツ
  2. エッグペペ
  3. ダークチョコレート
  4. 朝のコーヒー
  5. ザンビア
PAGE TOP