猫の手

どうしたらいいの?と試行錯誤した記録.

テーブルスクロール

表頭を固定して、表側をスクロースさせるには、

「JavaScriptライブラリ」を利用する
「JavaScriptライブラリ」を利用せずCSSで制御する

方法があります。

私は、CSSで制御する方法にしました。
というのも、いくつか既に「JavaScriptライブラリ」を使用しているため、JavaScriptファイルを増やしたくないので。

こちらを参考
    ↓
HTML TABLEタグでヘッダを固定にしてデータ部だけスクロール


※表頭が2行だったためうまくいかず、1行めの th は表題なのでテーブルの外にだすことで解決。(デザイン変更できない仕事だったため)
※ブラウザによりテーブルの横幅や列幅が揃わないため、幅を指定。

CSS記述は多いけれど、htmlファイルはクラス指定のみで完成!


ただ複雑なテーブルの場合は、ブラウザごとの調整が必要になるため、やはり「JavaScriptライブラリ」を利用するのが便利かなあ?デメリットは利用したことがないので不明ですが。。。