The View Transitions API And Delightful UI Animations (Part 2)

The View Transitions API is a new — but game-changing — feature that allows us to do the types of reactive state-based UI and page transitions that have traditionally been exclusive to JavaScript frameworks. In the second half of this mini two-part series, Adrian Bece expands on the demos from the first article to demonstrate how the View Transitions API can be used to transition not just elements between two states but the transition between full views and pages in single-page and multi-page applications. https://smashingmagazine.com/2024/01/view-transitions-api-ui-animations-part2/

Created 1y | Jan 2, 2024, 4:10:33 PM


Login to add comment

Other posts in this group

How To Build A Business Case To Promote Accessibility In Your B2B Products

When passion for accessibility meets business indifference, what bridges the gap? Gloria Diaz Alonso shares how she turned frustration into strategy — by learning to speak the language of business. ht

Apr 4, 2025, 7:30:15 PM | Smashing magazine
Building A Drupal To Storyblok Migration Tool: An Engineering Perspective

In this article, Edoardo Dusi shares the engineering and architectural choices made by the team at Storyblok and how real-world migration challenges were addressed using modern PHP practices. https://

Apr 3, 2025, 3:40:08 PM | Smashing magazine
How To Argue Against AI-First Research

Companies have been turning their attention to “synthetic,” AI-driven user testing. However, as convenient as it might seem, it’s dangerous, expensive, and usually diminishes user value. Let’s take a

Mar 31, 2025, 3:50:03 PM | Smashing magazine
Blossoms, Flowers, And The Magic Of Spring (April 2025 Wallpapers Edition)

The beginning of the new month is the perfect opportunity to give your desktop a makeover. If you’re looking for some beautiful and unique wallpapers to cater for a bit of inspiration this April, well

Mar 31, 2025, 3:50:02 PM | Smashing magazine
Adaptive Video Streaming With Dash.js In React

HTML <video> is the de facto element we turn to for embedding video content, but it comes with constraints. For example, it downloads the video file linearly over HTTP, which leads to performance hi

Mar 27, 2025, 7:10:08 PM | Smashing magazine
Previewing Content Changes In Your Work With document.designMode

You probably already know that you can use developer tools in your browser to make on-the-spot changes to a webpage — simply click the node in the Inspector and make your edits. But have you tri

Mar 21, 2025, 2:50:03 PM | Smashing magazine
Web Components Vs. Framework Components: What’s The Difference?

Some critics question the agnostic nature of Web Components, with some even arguing that they are not real components. Gabriel Shoyomboa explores this topic in-depth, comparing Web Components and fram

Mar 17, 2025, 3:50:02 PM | Smashing magazine