Video yükleniyor...
Video Yüklenemedi
Wanna see a 90-second speed run of on-page View Transitions?
145,876 görüntüleme • 2 yıl önce •via X (Twitter)
10 Yorum

1) I didn't do a fallback there. You should probably test that `document.startViewTransitions` exists first and do the DOM changes regardless. 2) Gosh @CodePen sure is nice for learning and playing isn't it? I'm glad I have thousands of Pens over a decade for reference.

3) Also do less if window.matchMedia('(prefers-reduced-motion: reduce)') is true.

View Transitions are a complete game changer. We can soon probably go back to mostly server rendered html with minimal JS and still get crazy interactive apps.

Where is “whatever” defined? Did you just give it a nonsense name, and somehow that enables the size animation?

Just needs any *unique* name at all. Having a name means "hold onto this element and try to tween it" (otherwise you get the cross-fade). If there are two elements with the same name, it just aborts.

Can you control the easing / timing? What is the benefit over using transition:

Yep there is optional CSS control over all of it.

Can’t wait for them to have cross browser compatibility 😍

MAYBE IF TWITTER VIDEO WASNT SO GARBAGE

In this simple use case, what is different from using a css transform? Are performance the same?
Benzer Videolar
Sensitive content
Who wanna see this little hood rat on the subscription page?
Lizardhunter
56,207 görüntüleme • 17 gün önce
Sensitive content
Wanna see the back view? 👀
Saki💋
162,186 görüntüleme • 2 yıl önce

