mirror of https://github.com/sveltejs/svelte
parent
e0af4e742d
commit
77df0b7c45
@ -1,11 +1,11 @@
|
|||||||
<script>
|
<script>
|
||||||
import { fade } from 'svelte/transition';
|
import { fade } from 'svelte/transition';
|
||||||
|
|
||||||
export let visible;
|
let visible;
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<input type=checkbox bind:checked={visible}> visible
|
<input type=checkbox bind:checked={visible}> visible
|
||||||
|
|
||||||
{#if visible}
|
{#if visible}
|
||||||
<p transition:fade>fades in and out</p>
|
<p transition:fade>fades in and out</p>
|
||||||
{/if}
|
{/if}
|
||||||
|
@ -1,11 +1,11 @@
|
|||||||
<script>
|
<script>
|
||||||
import { fly } from 'svelte/transition';
|
import { fly } from 'svelte/transition';
|
||||||
|
|
||||||
export let visible;
|
let visible;
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<input type=checkbox bind:checked={visible}> visible
|
<input type=checkbox bind:checked={visible}> visible
|
||||||
|
|
||||||
{#if visible}
|
{#if visible}
|
||||||
<p transition:fly="{{y: 200, duration: 1000}}">flies 200 pixels up, slowly</p>
|
<p transition:fly="{{y: 200, duration: 1000}}">flies 200 pixels up, slowly</p>
|
||||||
{/if}
|
{/if}
|
||||||
|
@ -1,11 +1,11 @@
|
|||||||
<script>
|
<script>
|
||||||
import { fade, fly } from 'svelte/transition';
|
import { fade, fly } from 'svelte/transition';
|
||||||
|
|
||||||
export let visible;
|
let visible;
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<input type=checkbox bind:checked={visible}> visible
|
<input type=checkbox bind:checked={visible}> visible
|
||||||
|
|
||||||
{#if visible}
|
{#if visible}
|
||||||
<p in:fly="{{y: 50}}" out:fade>flies up, fades out</p>
|
<p in:fly="{{y: 50}}" out:fade>flies up, fades out</p>
|
||||||
{/if}
|
{/if}
|
||||||
|
Loading…
Reference in new issue