このページを下にスクロールしてみてください。
このエリアは3000pxスクロールするまで固定されます。
要素Aに近づいています...
このセクションは`intro-section`の固定が解除された後に表示されます。
このエリアは前よりも長くなっています。
ここに、要素Aに続くようなコンテンツを配置できます。
さらにスクロールして、要素Aを見てみましょう。
要素Aがブラウザの上部に固定されている間、このコンテンツがスクロールせずに見え続けます。
さらに下にスクロールすると、要素Aとこのコンテンツの固定が解除され、通常のスクロールに戻ります。
ここでは、特定の情報や画像などを効果的に見せることができます。
固定区間は、GSAPの `end` パラメータで柔軟に調整可能です。
このテキストがスクロールしても画面から消えないことに注目してください。
これは、`sticky-container` がピンされている間、その内部のコンテンツが一緒に動くためです。
さらにスクロールして、固定が解除されるのを確認しましょう。
もうすぐ解除されます。
要素Aが固定を解除されて、通常のスクロールに戻りました。
ここからは、ページの残りのコンテンツが通常通りスクロールします。