jQueryでスクロールに追従する要素
jQueryでスクロールに追従する要素を作るには、以下のようにして実装することができます。
(以下のコードはあくまで一例です)
HTML
追従する要素を準備します。
CSS
追従するときのCSSを準備します。
JavaScript
以下のコードでは、スクロール時に準備した要素の上からの位置を取得し、ウィンドウのスクロールした上からの位置と比較します。
比較し、ウィンドウのスクロールの位置より超えている場合は、追従する要素にクラス名を割り当て、横の位置を設定します。
また、ウィンドウのスクロールの位置より下だった場合は、追従する要素のクラス名を削除し横の位置ももとに戻します。