|
|
|
@ -745,6 +745,7 @@ Slides an element in and out.
|
|
|
|
* `delay` (`number`, default 0) — milliseconds before starting
|
|
|
|
* `delay` (`number`, default 0) — milliseconds before starting
|
|
|
|
* `duration` (`number`, default 400) — milliseconds the transition lasts
|
|
|
|
* `duration` (`number`, default 400) — milliseconds the transition lasts
|
|
|
|
* `easing` (`function`, default `cubicOut`) — an [easing function](/docs#run-time-svelte-easing)
|
|
|
|
* `easing` (`function`, default `cubicOut`) — an [easing function](/docs#run-time-svelte-easing)
|
|
|
|
|
|
|
|
* `axis` (`'x'` | `'y'`, default `'y'`) — direction of the transition
|
|
|
|
|
|
|
|
|
|
|
|
```sv
|
|
|
|
```sv
|
|
|
|
<script>
|
|
|
|
<script>
|
|
|
|
@ -753,7 +754,7 @@ Slides an element in and out.
|
|
|
|
</script>
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
|
|
{#if condition}
|
|
|
|
{#if condition}
|
|
|
|
<div transition:slide="{{delay: 250, duration: 300, easing: quintOut }}">
|
|
|
|
<div transition:slide="{{delay: 250, duration: 300, easing: quintOut, axis: 'x' }}">
|
|
|
|
slides in and out
|
|
|
|
slides in and out
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
{/if}
|
|
|
|
{/if}
|
|
|
|
|