Ordinarily, transitions will play on elements when any container block is added or destroyed. In the example here, toggling the visibility of the entire list also applies transitions to individual list elements.

Instead, we'd like transitions to play only when individual items are added and removed — in other words, when the user drags the slider.

We can achieve this with a local transition, which only plays when the block with the transition itself is added or removed:

<div transition:slide|local>

loading editor...


loading Svelte compiler...

loading editor...

Compiler options

result = svelte.compile(source, {

loading editor...