google-chrome 4 months ago

Chrome | Bringing Page Transitions to the Web

Native apps often feature transitions between states that both look great and help communicate the type of navigation to the user. The bad news: creating transitions between pages on the web is impossible. In-page transitions are possible, but complex. The good news: new APIs are coming to simplify this process, building on top of CSS animations and the web animation API, and it works across navigations!

Demo:

https://http203-playlist.netlify.app

requires document-transition and enable-experimental-web-platform-features flags


Developer guide:

https://github.com/WICG/shared-element-transitions/blob/main/developer-guide.md


Codelab:

https://codelabs.developers.google.com/create-an-instant-and-seamless-web-app#0




Google