Svelte Transitions Animations Transition Animate Crossfade

Definisi

Svelte punya transisi bawaan (fade, slide, fly, scale) lewat directive transition:, in:/out:. animate:flip untuk animasi pergerakan list, dan crossfade untuk perpindahan elemen antar container.

Kapan dipakai

Pakai transisi untuk feedback visual saat elemen muncul/hilang ({#if}, {#each}). Hindari berlebihan — transisi lambat mengganggu UX.

Cara kerja

Transisi dasar

svelte

<script>
  import { fade, fly } from 'svelte/transition';
  let show = false;
</script>
 
{#if