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. 2013年上半期jQueryプラグインまとめ

    JavaScript

    当ブログで紹介したjQueryプラグイン12選のまとめ 2012/08 – 2012/0…

    2012年8月〜2012月9月までの当ブログで紹介したjQueryプラ…

  2. Points Of Interest

    JavaScript

    各ポイントごとにクリックで詳細文を表示させるjQuery「Points Of Interest」

    Points Of Interestはサイト内に設置した各ポイントを…

  3. flubber

    JavaScript

    滑らかなシェイプアニメーションを実装できる「flubber」

    flubberは、滑らかな2Dによるシェイプアニメーションを実装するこ…

  4. TabTab.js

    JavaScript

    アニメーション付きで切り替わるjQueryのタブプラグイン「TabTab.js」

    TabTab.jsは素敵なアニメーション付きのタブコンテンツを実装する…

  5. funnyText.js
  6. Material Design Responsive Table

最近の記事

  1. ハワイ カウ
  2. ぼんしゃん全部入り
  3. ナイトロコーヒー
  4. チーズベーコンエッグバーガー
PAGE TOP