開発備忘録&ふと思ったこと読み流してください。システム開発ネタが多いです。itsysgroupテーブルヘッダーを縦スクロールで固定する方法のシステム開発備忘録です。テーブルのヘッダーを固定する要望は多いと思いますが、何かと面倒なプログラミングになってしまいます。テーブルヘッダーを固定する方法そこで、今回は主にCSSとjQueryでテーブルのヘッダーを固定する方法を調査テストしたので、その備忘録です。floatにすることでoverflowが有効になります。ヘッダー部、ボディー部、フッター部と横に伸びて行く事になります。そこで後程、折り返しが付くようにtdもしくはthの幅をjqueryにて求めてセットします。2)ヘッダー部の高さを決めます。今回のテストでは200pxにしています。スクロールバーが表示されるように設定します。3)th,tdの高さや幅を要件沿って設定します。jqueryで立ち上げ時に幅を求めます。幅が動的に変更されるような場合は再度設定する必要があります。4)Jqueryでテーブル幅を設定します。今回は各thの幅+border幅を足して行きます。最後にテーブルのborder幅とスクロール幅を足しました。調整が必要な場合も有るようですので、動かして確かめてください。コードを下に示します。</table></body></html>縦スクロールだけで有れば割と簡単にテーブルヘッダーの固定ができます。以上、テーブルヘッダーを縦スクロールで固定する方法のシステム開発備忘録でした。修正2020/06/12以前載せていたコードが上手く動作しないことを発見しました。取得できない事でした。下のバージョンがNGの読み込みです。src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>修正したjQueryの参照先を下に示しておきます。src="http://code.jquery.com/jquery-latest.min.js"></script>修正前のコードを参照してjQueryが動かなかった方が居られましたら、この場を借りてお詫びいたします。