tabellajs

JavaScript

タッチ対応のレスポンシブなテーブルを実装できる「tabellajs」

tabellajsはタッチに対応したレスポンシブで操作性のよいテーブルを実装することができます。jQueryなどに依存しない、ピュアJavaScriptなテーブルプラグインです。オプションもたくさんあり、カスタマイズして使用することも可能です。

tabellajs

デモ

デモでは左右に矢印が付いたテーブルが設置されていて、矢印をクリックするとテーブル内の項目を移動できる仕組みになっています。モバイル版ではスワイプすることで項目を移動させることが可能です。

サクサクと操作できるので、とても見やすいテーブルですね。実際にiPhoneでも確認してみたところ、動作もスムーズで使いやすかったです。

オプションには、cellBreakpoints、descBreakpoints、from、to、currency、duration、easing、reboundSpeed、edgeThreshold、swipeSingleTick、onRefreshSize、headerRowDevider、emptyCell、fixedHeader、fixedHeaderBottomThreshold、fixedHeaderTopといった項目が用意されています。

オプションを利用して、細かい部分までカスタマイズできるのはうれしい仕様ですね。ちなみに、easingのデフォルト値はeaseInOutSineです。easingの値にはこの他にもeaseInSine、easeOutSine、easeInOutSine、easeInQuad、easeOutQuad、easeInCubic…など全部で24種類ものエフェクトがあります。

tabellajs

関連記事

  1. SuperEmbed.js

    JavaScript

    さまざまな埋め込み動画をレスポンシブで表示できる「SuperEmbed.js」

    SuperEmbed.jsは、さまざまな埋め込み型の動画をレスポンシブ…

  2. imgViewer2

    JavaScript

    画像のズームとパン機能を備えたjQueryプラグイン「imgViewer2」

    imgViewer2は画像のズームとパン機能を備えたjQueryプラグ…

  3. jfMagnify
  4. Impulse Slider

    JavaScript

    3Dスライダーを実装できるjQueryプラグイン「Impulse Slider」

    Impulse SliderというjQueryプラグインを使えば3Dス…

  5. Bricklayer

    JavaScript

    軽量なグリッドレイアウトを実装できる「Bricklayer」

    Bricklayerは軽量なグリッドレイアウトを実装することができるラ…

最近の記事

  1. USB-2H401BKN
  2. Dyson Pure Cool Me
  3. ルック セレクション
  4. シルキーウインドモバイル

アーカイブ

PAGE TOP