HTML view transitions are on the way

Week 290 was posted by Charanjit Chana on 2023-05-15.

Covered at Google I/O last year and in another video on the Google Chrome Developers channel, View Transitions are on the way are will provide the ability for multi-page apps to seamlessly move from one view to another.

At this point in time, it seems a bit hit and miss in my limited testing, but they work really nicely for simple examples.

Best of all, no JavaScript necessary (but you do need the Canary version of Google Chrome and to enable the flags).

LOOK. This is just a regular ol' website. No JavaScript whatsoever. Navigation pages with clicks links to other HTML pages. The most basic website in the world. Yet, with a few lines of code to activate View Transitions, KAPOW.

View on twitter

Chris Coyier posted a video and link to a demo, it works really well. In fact, it's really interesting to see it work as well as it does. So much so, that I thought it would be a good thing to add to Good Gear Club for certain views but it doesn't feel like it's quite there yet.

Go check out Chris' demo while using Google Chrome Canary, the flag you're looking for is called 'viewTransition API for navigations'.

I'll be playing with the transitions a little more and may add them in anyway so that they are available if/when this becomes a general purpose API. My biggest struggle right now is figuring out which elements to apply the attributes to... or I guess how best to move it in to my CSS.

Tags: development, html

Tweet WhatsApp Keep Upvote Digg Tumblr Pin Blogger LinkedIn Skype LiveJournal Like