この手順で実装可能になります。基本offset()は上記のようにドキュメントの左上を起点にしています。ブラウザの左上ではなく、ドキュメントの左上となります。スクロールしたら起点はブラウザ上からは見えなくなる、ということになります。HTML実装サンプルのソースを見てみましょう。すいません、説明が下手でソースが長すぎますね。〜〜〜固定したい箇所(今回は、タブとテーブルのヘッダー部)にクラス「.navTypeA」としてdivでくくります。その下には、固定後に表示される内容を記述。{$body.removeClass(‘is-fixed’);}});});固定位置のターゲットまでスクロールしたら、bodyタグに「.is-fixed」が付与されるように設定。上部のスクロールさせて固定位置に戻った場合、「.is-fixed」を削除。あとは、CSSで固定の記述を対応。82px;}固定位置のターゲットまでスクロールしたら、bodyタグに「.is-fixed」が付与されるように設定。ページ上部にスクロールさせて固定位置に戻った場合、「.is-fixed」を削除。ポイント固定位置まで移動した際に、なめらかに動作させるために一工夫がいります。82px;}トミーこれは、固定したテーブルのヘッダーの高さが82pxあったので、空き設定を行います。これをしないと、ID1の内容が固定位置までいった時点で、ヘッダー部の下に隠れてしまい、動きに違和感がでてしまいます。それを解消するためのテクニックになります。テーブルの列が意図した幅に調整できない!ってなってる方は、こちらの記事をご参照ください。【table】widthで指定した幅が反映されない場合の対応方法2020年7月9日まとめいかがだったでしょうか?少し分かりづらかったかもしれませんが、よく使うテクニックですので参考になれば幸いです。応用も効く技術だと思います。実際、僕は「パークサイドビル様」のサイトで部屋を予約する際に右サイドに現状の料金がでてくるのですがそこで使用しました。リアルタイムで料金表を表示できるように工夫しました〜。最後まで、閲覧していただきありがとうございました。Web関連ブログこの記事が気に入ったらいいねしよう!最新記事をお届けします。コメントをキャンセルメールアドレスが公開されることはありません。*サイト次回のコメントで使用するためブラウザーに自分の名前、メールアドレス、サイトを保存する。上に表示された文字を入力してください。htmlファイル内でphpを動かす方法RECOMMENDこちらの記事も人気です。