ページをスクロールしたときに、メニュー(サイドバー)のスクロールを画面上端あたりまでに制限する方法には、CSS の sticky position を使う方法や、JavaScript を使用する方法があります。 position: sticky を使ってサイドバーのスクロールを抑制する方法 下記のデモページをスクロールすると、最初はメニュー(サイドバー部分)も一緒にスクロールしますが、ある位置を超えるとメニュー位置が固定されます。 このやり方は、ページ上部のヘッダに大きなアイキャッチ画像などを入れているサイトなどでたまに見かけます。 デモ(別ウィンドウで開く) CSS の Sticky positioning に対応したブラウザであれば、次のようにして要素のスクロールを簡単に制限することができます。 .yourElement { position: -webkit-sticky; /* f