mirrors/svelte
mirrors/svelte
0
0
Fork 0
mirror of https://github.com/sveltejs/svelte.git synced 2024-12-01 17:30:59 +01:00
Code Issues Releases Wiki Activity

flesh out in/out transition tutorial chapter (#2792)

Browse Source
This commit is contained in:
Richard Harris 2019-05-26 14:29:30 +02:00
parent 0891495647
commit 0d7f6fb795
1 changed files with 7 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
site/content/tutorial/10-transitions/03-in-and-out/text.md
View File

@ -2,7 +2,13 @@
title: In and out title: In and out
--- ---
Instead of the `transition` directive, an element can have an `in` or an `out` directive, or both together: Instead of the `transition` directive, an element can have an `in` or an `out` directive, or both together. Import `fade` alongside `fly`...
```js
import { fade, fly } from 'svelte/transition';
```
...then replace the `transition` directive with separate `in` and `out` directives:
```html ```html
<p in:fly="{{ y: 200, duration: 2000 }}" out:fade> <p in:fly="{{ y: 200, duration: 2000 }}" out:fade>