スクロールスパイ

Scrollspy

スクロール位置に応じて、現在表示中のセクションに対応するナビゲーション項目を自動的にハイライトするUI。

○ 使う場面

スクロールスパイ

「スクロールスパイ」という名前は、UIフレームワークBootstrapのコンポーネント名として広く知られるようになった呼称で、いまどのセクションが見られているかをこっそり見張る（spy）という語感に由来するとされる。

近縁種	違い・使い分け
追従セクション	スクロールスパイは追従セクションと同じ「長い記事のスクロールに連動する」挙動だが、追従セクションが要素そのものの画面上の位置を固定するのに対し、スクロールスパイは要素の位置は動かさずナビゲーション側のハイライト状態だけをスクロールに合わせて切り替える。両者は組み合わせて使われることも多い。
タブ	タブとは並列コンテンツの現在位置を示す点で似ているが、タブはクリックによる能動的な切り替えで1パネルしか表示しない離散的なナビゲーションであるのに対し、スクロールスパイは1ページ内に並んだ全セクションを連続的にスクロールし、ハイライトだけがスクロール位置に応じて自動的に追従する点で対照的である。

近縁種

違い・使い分け

スクロールスパイは追従セクションと同じ「長い記事のスクロールに連動する」挙動だが、追従セクションが要素そのものの画面上の位置を固定するのに対し、スクロールスパイは要素の位置は動かさずナビゲーション側のハイライト状態だけをスクロールに合わせて切り替える。両者は組み合わせて使われることも多い。

タブとは並列コンテンツの現在位置を示す点で似ているが、タブはクリックによる能動的な切り替えで1パネルしか表示しない離散的なナビゲーションであるのに対し、スクロールスパイは1ページ内に並んだ全セクションを連続的にスクロールし、ハイライトだけがスクロール位置に応じて自動的に追従する点で対照的である。