Turn

Turn is a library for animating page transitions in Turbo Drive apps. It applies various class names to the HTML element during the lifecycle of a navigation. Targeted elements can then use these classes to apply animations. It supports View Transitions and can be used with a combination of the two approches.

Examples

1. Basic: immediate exit animations, followed by enter animations (without View Transitions)
2. View Transitions: transitions common elements between pages (where supported, without a fallback)
3. Fallback: animate with View Transitions, with a fallback to custom exit/enter animations
4. Hybrid Basic: combines custom CSS exit and enter animations with View Transitions for common elements between pages
5. Hybrid Advanced: similar to the basic example but only uses a custom CSS exit animation; the enter animations are achieved with a View Transition
6. Animate Restore: animating restoration visits from native controls is generally discouraged, but if your app has Back links, this approach provides a nice user experience