スクロールによって表示位置の異なるヘッダーを作成したい

Question

現在こちらのテストページを作成中です。

下スクロールでヘッダーが消え、上スクロールでまた現れる動作に加えて
以下の動きを実行したいです。

最終的に楽天rms内に#oh_wrapperの内容を埋め込むため
最初の読み込み時はヘッダーを絶対配置的に置く必要があり
少し特殊なソースの書き方になっています。

どなたかわかる方、どうぞよろしくお願いいたします。

Answer 1

前回回答したコメントにつけていたcodepenのものを修正しましたよ。
https://codepen.io/SE-studying-now/pen/pxpjyR

手助けになればと思います。

＃何をどこまでやって何がわかっていないのか、等を提示せずやりたいことだけを書くと回答が付かないうえに低評価されちゃいますよ。今後お気をつけを！

Comments

[bibinba666]

評価が遅くなり申し訳ありません。
ご丁寧にありがとうございます。とても助かりました。
teratail初心者のため、質問の仕方が悪くご迷惑をおかけしました。以後気を付けます。