A rather geeky/technical weblog, est. 2001, by Bramus
precommitHandler
By using two sequential View Transitions when intercepting links with the Navigation API – one in the precommitHandler and one in the regular handler – you can fake a Two-Phase View Transition today!
Check out the post I wrote for developer.chrome.com to learn what changed for View Transitions in 2025.
A new View Transitions-related feature we shipped in Chrome 140 is the ability to nest ::view-transition-group() pseudos. This is useful for retaining visual effects such as clipping, move elements as part of a group, etc.
If you thought we were done with View Transitions, guess again! A feature Chrome is working on, is “Scoped View Transitions”, which allow you to scope a VT to a subtree of the DOM. We are actively looking for feedback on this one.
At Middlesbrough Front End 2025 I gave a talk about some of the more exotic applications of View Transitions
Slides + Recording of the talk “Supercharge Web UX with View Transitions” I gave at WebExpo.
For this year’s Google I/O, I recorded the session “Web animations today and tomorrow”. Check it out to learn how to guide, inform, and delight users by adding subtle and supportive animations to your web UIs.
border-radius with a View Transition, revisited
Instead of duplicating an animation on the ::view-transition-group pseudo, you can also rely on CSS transitions on the original element … if you’ve set it up correctly.
border-radius with a View Transition To smoothly animate things like borders as part of a View Transition, you need to duplicate that animation onto the ::view-transition-group. For best effect, have the View Transition separately capture the background and foreground of the element you’re animating.