スクロール · スクロールで変わる
ビュートランジション视图转场
- 全体像
- ネイティブ
- 省力
ブラウザが切り替えの前後でそれぞれ画面を記録し、その差分を自動でアニメーションとして補います。
使いどころ
ページ全体や複数ブロックが同時に変わるとき、要素ごとに手書きしたくない場合に使います。1 つの要素を細かく制御したいときは「共有要素トランジション」を使います。
パラメータ
view-transition-name · ::view-transition-old / new · 300ms ease-in-out
レシピ
ビュートランジション → 300ms ease-in-outビュートランジション → view-transition-name · ::view-transition-old / new
AI に渡す一文
このページ切り替えに View Transitions API を使ってください。主要な要素に view-transition-name を付け、::view-transition-old と ::view-transition-new に 300ms の ease-in-out を指定します。