TIL the Shared Element Transitions
POSTED ON:
This is still super-experimental. So much that I can see this being 'ready' in five years.
These cool effects exist on mobile.
And Google and the Chrome team has been pushing for the web to have those complex transitions too.
Creating a transition from one page to another after clicking a link is, well, impossible. But, it isn't exactly easy within a single-page app either.
Even in a simple case, where content fades from one screen to another, it means rendering your page with both states at once, performing a cross-fade, then removing the old state.
They've been hard at work at a Shared Elements Transitions API
, which will allow us to do that.
Test it yourself: https://sleekwp.dev/fun/page-transition/
To check on the status: https://chromestatus.com/feature/5193009714954240
Via
Smooth and simple page transitions with the shared element transition API
and this Reddit post I played around with Chrome's new "Shared Element Transitions"
Related TILs
Tagged: animation