[JS]表組みのヘッダを固定し、表示する列も選択できるスクリプト

表組みのヘッダを固定表示し、データのみスクロール表示を可能にするスクリプトを紹介します。

デモのキャプチャ

Scrollable Fixed Header Table – A JQuery Plugin
デモページ

スクリプトの機能はヘッダの固定表示だけではなく、表示する列をユーザーが選択することもできます。

デモのキャプチャ

左上のアローをクリックすると、チェックボックスが表示されます。

スクリプトはクッキーにも対応しており、選択した列をクッキーに保存することも可能です。

スクリプトはjQueryのプラグインのため、実装にはjquery.jsが必要です。
オプションでは、テーブルの幅と高さ、列選択の有無、クッキーの有無を設定できます。基本の書式は下記のようになります。

JavaScript

sponsors

top of page

©2018 coliss