mirror of https://github.com/sveltejs/svelte
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
17 lines
455 B
17 lines
455 B
6 years ago
|
---
|
||
|
title: Transition events
|
||
|
---
|
||
|
|
||
|
It can be useful to know when transitions are beginning and ending. Svelte dispatches events that you can listen to like any other DOM event:
|
||
|
|
||
|
```html
|
||
|
<p
|
||
|
transition:fly="{{ y: 200, duration: 2000 }}"
|
||
|
on:introstart="{() => status = 'intro started'}"
|
||
|
on:outrostart="{() => status = 'outro started'}"
|
||
|
on:introend="{() => status = 'intro ended'}"
|
||
|
on:outroend="{() => status = 'outro ended'}"
|
||
|
>
|
||
|
Flies in and out
|
||
|
</p>
|
||
|
```
|