ページの中央に位置が固定されている要素をスクロールしようとしています。
つまり、ドキュメント フロー内でスタックしていない位置は、ビューの中央にある必要があります。
// This code snippet is here because stack overflow doesn't let me post the codepen link without it.
// Using scrollInToView in a stack overflow snippet doesn't work correctly and will just make it more confusing to demo this issue
// Pseudo code
buttonElement.onClick(e =>
stickyElement.scrollIntoView(options)
)
ヘッダーには、scrollIntoView を使用してページのその部分にスクロールするナビゲーション リンクがあります。
3 番目のセクションには位置スティッキーがあります。
現在ドキュメント フローにある場合 (静的/相対位置など)、正常に動作します。
現在ドキュメント フローにない場合 (絶対位置/固定位置など)、そのように動作し、最後までスクロールしません。(左下のページタイトルボタンのように。)
scrollInToView はスティッキー要素で動作するはずですが、それらは時々ドキュメント フローに含まれる可能性がありますか?
どうすればこれを回避できますか?