Googleは3月27日(現地時間)、Chromeの最新版バージョン147で要素スコープのビュー遷移を正式導入したと発表した。
今回の新機能により、Element.startViewTransition()を利用してDOMのサブツリー単位でビュー遷移を開始できる。これにより、複数のビュー遷移の同時実行やネストされた遷移が可能となり、position: fixedが絡むレイヤリングの問題も解決できる。
また、遷移中もページの他部分のインタラクション性を維持できる。スコープルートはデフォルトで自己参加型となっているほか、ネストした疑似要素や、オーバーフロー時の自動クリップ処理も組み込まれた。
さらに、contain: layoutおよびview-transition-scope: allが自動適用される。これらの機能は、Chrome 140でデベロッパーテスト版として予告されていたが、コミュニティやCSSワーキンググループと協力して仕様が確定した。
- 関連リンク
この記事は参考になりましたか?
- この記事の著者
-
CodeZine編集部(コードジンヘンシュウブ)
CodeZineは、株式会社翔泳社が運営するソフトウェア開発者向けのWebメディアです。「デベロッパーの成長と課題解決に貢献するメディア」をコンセプトに、現場で役立つ最新情報を日々お届けします。
※プロフィールは、執筆時点、または直近の記事の寄稿時点での内容です
