お世話になっております。
テーブルをスクロールした際に一番上の行を固定したいのですが、検索しても見つからず質問させて頂きました。
どなたか教えて頂けないでしょうか。
ジャバは超初心者です。
nekokoさん
こんにちは。
レコード詳細画面のサブテーブルのヘッダー固定は、CSSを使って実装できます。
stickyの使い方については、「テーブル 固定 sticky」などでググってみてください。
.show-subtable-gaia th {
position: sticky;
top: 128px; /* 固定位置（メニューバーの縦幅分を考慮）*/
}
CSSを使って実装できるんですね！
早速試してみます。
ありがとうございます。
koichi様
送っていただいたCSSのコードを入力したのですが反映されず、画像のような状態に警告が出てきてしまいます。お手数ですが間違えている箇所かわかりましたらご指摘いただけないでしょうか。
nekokoさん
そちらのエラーは無視して問題ありません。
上記コードで反映されない場合は「position: -webkit-sticky;」も追加してみてください。
なお、IE11ではstickyが対応していませんので、以下のように別途JSを書く必要があります。
koichi様
追加コード有難うございます。
追加コードの位置はこの位置で宜しいのでしょうか。
IE１１ではないことは確認したので、貼っていただいたリンクは今回は使わないで済みそうなのですが、うまく反映されません。
@charset "UTF-8";
.show-subtable-gaia th {
position: sticky;
top: 128px; /* 固定位置（メニューバーの縦幅分を考慮）*/
position: -webkit-sticky;
}
nekokoさん
位置はそこで問題ないのですが、反映されないとなると別の問題がありそうです。
ちなみに詳細画面＝レコード保存後の画面で合っていますか？
もし編集画面もでしたら以下に変更してみてください。
.show-subtable-gaia th, .edit-subtable-gaia th {
position: sticky;
position: -webkit-sticky;
top: 128px; /* 固定位置（メニューバーの縦幅分を考慮）*/
z-index: 1;
}
また、サブテーブルで合っていますか？（関連テーブルでなく）
koichi様
ご教示ありがとうございます。
確認したところ適用しないにチェックが入っていました。
お手数おかけしてすみません。細かく丁寧にご教示して頂きありがとうございます。
nekokoさん
JSEditプラグインの設定のところですね。
解決されたようで良かったです！
koichi様
おっしゃる通りプラグインのところです。
本当にありがとうございました！
このトピックはベストアンサーに選ばれた返信から 3 日が経過したので自動的にクローズされました。新たに返信することはできません。