Transition functions can accept parameters. Replace the fade transition with fly...

	import { fly } from 'svelte/transition';
	let visible = true;

...and apply it to the <p> along with some options:

<p transition:fly="{{ y: 200, duration: 2000 }}">
	Flies in and out

Note that the transition is reversible — if you toggle the checkbox while the transition is ongoing, it transitions from the current point, rather than the beginning or the end.

loading editor...


loading Svelte compiler...

loading editor...

Compiler options

result = svelte.compile(source, {

loading editor...