Daily Code / JavaScript・ブラウザ標準API
スクロールでカードの見え方を測ろう
このデモについて
青い枠の中でスクロールすると、カードが25%または75%見えたときに表示が変わります。架空データのみ・ログイン不要です。
まず試す
- 下の枠内をスクロールして、緑色になるカードを見る。
- 「可視率の条件」を25%から75%へ変更する。
- 「観察停止」を押してスクロールし、表示が固定されることを比べる。「観察再開」で戻せます。
準備中…
架空タスクA
資料の確認（ダミー）
計測待ち架空タスクB
図表の整理（ダミー）
計測待ち架空タスクC
結果の共有（ダミー）
計測待ち計測待ち
表示する割合は、IntersectionObserverから最後に通知された時点の値です。スクロールに連続追従する測定器ではありません。緑色は教材の条件を満たす意味で、実際の業務進捗を表しません。