リクエスト広場

1) fix-colは対象列が"|~A|"だと機能しない
例えば以下。|~2|のところは機能しません。

#tablescroll(fix-col){{
|AAAAAAAAAAAAAAAA|BBBBBBBBBBBBBBBB|CCCCCCCCCCCCCCCC|DDDDDDDDDDDDDD|EEEEEEEEEEEEEEEE|FFFFFFFFFFFFFFFF|GGGGGGGGGGGGGGGG|HHHHHHHHHHHHHHHH|h
|1|6|11|16|21|26|31|36|
|~2|7|12|17|22|27|32|37|
|3|8|13|18|23|28|33|38|
|4|9|14|19|24|29|34|39|
|5|10|15|20|25|30|35|40|
}}

先頭列は強調表現で"~"で記述することは良くあるので、これでは使えません。
以下のように修正すれば上手く行くようです。

.tablescroll-fix-col table td:first-child{left:0;position:sticky;z-index:1}
//↓修正
.tablescroll-fix-col table tr>*:first-child{left:0;position:sticky;z-index:1}

2) 罫線はオリジナルと同じに
太いと目立ちすぎる。機能を使ってない表と見た目が違うので違和感が出る。
以下のようにすると以前とほぼ同様になりました。ただしヘッダ/フッタの境界線は二重になります。まあこれはこれでいいかなと。

//追加、要色指定
.tablescroll table tr>*{border-right:1px solid;border-bottom:1px solid;border-top:none;border-left:none}
.tablescroll table tr>*:first-child{border-left:1px solid}
.tablescroll table tr:first-child>*{border-top:1px solid}

3) 固定列は複数できるとよい

ヘッダ行は必要なら複数行積めるので、今のままでもなんとかなる。
しかし列は先頭1列だけだと不自由なのでなんとかしたい。
例えば1列目大分類、2列目中分類、3列目小分類みたいな書き方は良くある。

追加で任意の2列をロックできるようにする。
fix-col(先頭固定)とは別に、例えばfc2、fc3とかオプションを作る。
fc2もfc3も機能は同じで、固定したい列番号と左からの固定位置を指定する。例えば以下。

//追加オプション
.tablescroll.tablescroll-fc2 table tr>*:nth-child(列番号){left:固定位置px;position:sticky;z-index:1}

利点は任意の列を任意の位置に固定できる。
fix-colと組み合わせれば左から2列目3列目も固定できるし、fix-colを使わず独立して任意の列を好きなようにロックできる。
問題点は固定値を自分で割り出さないといけない。テーブルのc定義書式で幅を決めれば見当はつくが試行錯誤が必要。またスマホなど環境が変わるとズレるかも。

4) 右端と最下段も固定可能に
一番下が最新情報だったり、左下が基準点となることもあるので最下段で固定可能に。
右端は備考列や単位列固定に使える。
オプションが増えると長くなるので、fix-の文字列は無くてもよいかも。

//追加オプション fix-foot
.tablescroll-fix-foot table tfoot{position:sticky;bottom:0;z-index:2}
//追加オプション fix-col-last
.tablescroll-fix-col-last table tr>*:last-child{right:0;position:sticky;z-index:1;border-left:1px solid}

5) 高さ指定のとき、縦のスクロールバーを最下段開始指定できるように
表を下に向かってどんどん追記することがある。例えば履歴だったり追加要素だったり。
こういった表は従来、全体が長くなるのでfoldで畳んだりしてる。
今回の機能はヘッダ固定と表示領域の高さ指定できるので、これを利用すれば常時展開しても邪魔にならなくなる。
このとき最初の表示位置が表の一番下であってほしい。つまりオプションでスクロールバーの初期位置を下に指定できるとよい。
(これは未検討。)