概要
スクロール途中で対象コンテンツが画面上部に固定され、さらにスクロールするとスクロール量に応じてコンテンツのアイテムが切り替わる。用途・要件
- 対象コンテンツまでスクロールすると、コンテンツが画面上部に固定する。(position: sticky; 使用)
- さらに各アイテムの高さ(100vh * アイテム数)分スクロールすると、対応するアイテムに切り替わる。（DEMOでは3つのアイテムに切り替わる）
- アクティブなアイテム要素にis-activeクラスを付与する。
検証ブラウザ
- Google Chrome(最新)
- Safari(最新)
- Firefox(最新)
- Microsoft Edge(最新)
実装
ローカル環境にコードを移設した際に動作しない場合はこちら。（トラブルシューティングページへ）
