svelte-shared-transition

Transition shared elements between routes easily.

Install

yarn add svelte-shared-transition

Usage

import SharedTransition from "svelte-shared-transition";

<SharedTransition key="hero" />
 
<div data-key="hero"></div>

Transition starts once the components is mounted.

Props

name	type	default	description
key	string		the key shared by the elements to be transitioned.
easing	string	ease-in-out
delay	number	0.0
duration	number	250
clear	boolean	false	clear animation properties when done transitioning.

Methods

• play
• pause
• update

Demo