getBoundingClientRect() 活用デモ

1. ツールチップの表示位置計算

ボタンの座標とサイズを取得し、その真上にツールチップを表示します。

ここだよ！

2. 座標を計算して吸い付く「マグネットボタン」

要素の中心座標を計算し、マウスの動きに追従させます。

3. スクロール領域の判定

下の箱が画面内に入ったかを判定します。スクロールしてみてね！

↓ スクロールしてね ↓
画面に入ると色が変わるよ！