Native cross-page transitions, a look into the future!

Подробнее о видео

In this livestream we’ll explore the upcoming “Cross-document view transitions for multi-page applications” feature, which is already available in Chrome v126 and enables creating app-like transitions between pages without using any JavaScript!

-----------------------------------------------

// TIMESTAMPS

00:00 Countdown + pre-show chatter
04:00 Cross-document view transitions overview
08:26 View transition example
9:24 It's experimental
10:04 How it works
20:07 What's really happening
21:49 Creating a left-to-right animation
33:13 How AstroJS made the example website
34:57 Applying view transitions to CMS elements
36:48 Using a Custom Element to add a style attribute
45:03 Customizing the type
49:50 Customizing view transitions with JavaScript
56:45 Other browser availability
01:00:54 Outro

-----------------------------------------------

// RESOURCES FROM THE VIDEO

Alex looked at view transitions in the "Going in-depth: Create pure CSS animations for Webflow | Part 2" video exclusive for F+:
Astro JS Spotify clone:
Docs:
Chrome v126 -

Finsweet.com -
Finsweet merch store -
Signup to Finsweet+ -
Subscribe to Finsweet YouTube -

-----------------------------------------------

// ABOUT US

We’re Finsweet - a Webflow enterprise partner, badass product creator, and educational content powerhouse. We are taking Webflow to a new level and sharing everything with you along the way!

🙌 Join our community -
🔥 Add superpowers to your Webflow website -
🧰 Extend your Webflow workflow -
🚀 Build clear, scalable & organized Webflow websites -
👀 Check out products used at Finsweet -
🛍️ Buy Finsweet merch -

-----------------------------------------------

// SOCIAL

Podcast:
Twitter:
Instagram:
Facebook:
Dribbble:
Behance:
Webflow:

-----------------------------------------------

// TAGS

#crosspage #transition #nocode

-----------------------------------------------

Thanks for your support! 🤟