What you want here is not: .parent { perspective: 600px; } …but: .child { transform: perspective(600px); } css-tricks.com/why-isnt-my-...
Post
css-tricks.comWhy Isn't My 3D View Transition Working? | CSS-TricksWhy isn't my 3D view transition working?! Sunkanmi tackles this frustration and offers an elegant fix for it.
...but you can also just set perspective on the parent as usual. The only thing to remember is that, when animating view transition pseudos, the direct parent of both the old and new images is the image-pair pseudo element: ::view-transition-image-pair(root) { perspective: 50cm; }
vtbag.devPlaying Tower of HanoiFun With View Transitions, Episode 7: Tips, tricks, and fresh ideas to spark your own view transition magic!
Yeah, both approaches work well. It’s always reassuring when there isn’t just one “right” answer, but a few good options to choose from depending on the situation.
0 reposts1 like
No replies yet.