CSS Mode

These transitions use cssMode: true — Flyva applies Vue-style stage classes (*-leave-from, *-leave-active, *-leave-to, etc.) and listens for transitionend / animationend to resolve. No JavaScript animation code needed.

CSS Fade

A simple opacity crossfade driven entirely by CSS transitions. The transition classes are derived from the key name cssFadeTransition.

Home (fade)

CSS Slide

A horizontal slide — the old page moves left and fades while the new page slides in from the right.

Home (slide)

How it works

  • Transition definition — just { cssMode: true }, no leave/enter hooks
  • Stage classes — Flyva adds *-leave-from + *-leave-active, then swaps to *-leave-to on the next frame. Same pattern for enter.
  • Completion — detected via transitionend / animationend events