День добрый, господа и дамы Пытаюсь добавить эффект перехода к

Question

Svelte [svelt] - All about Svelte JavaScript framework.

День добрый, господа и дамы Пытаюсь добавить эффект перехода к

тэгу, но не прет =(
Может кто подсказать?
Мне хотелось бы, чтобы div при загрузке страницы начинал исчезать и удалялся из DOMа через 3 сек.
С помощью jQuery это реализуется просто:
$(".loader").fadeOut(3550, function () {
$(this).remove();
});
В svelte какая-то байда с функцией fade. В аналогичной форме с джеквери оно не пашет:
<script>
import { fade } from "svelte/transition";
import { expoOut } from "svelte/easing";
</script>


<div class="loader" out:fade={{ delay: 0, duration: 3550, easing: expoOut }}>
<h1 class="loader-hello">Hello</h1>
<h1 class="loader-world">World</h1>
</div>

В API нашел, что переход (то бишь transition) инициируется добавлением или удалением элемента из DOM в результате изменения состояния приложения. Я правильно понял, что без блока {#if visible} {/if} ничего не будет работать? Надо использовать какой-нибудь setTime() или setInterval()... и на кой мне тогда свойство delay? =\

#programming #russian #svelte

0

23.03.2021

4 ответов

9 просмотров

Коржик Автор вопроса

Daniil Kozlov
Все верно поняли. Delay — это задержка применения ...

Спасибо за ответ.

0

23.03.2021

Mark Tanashchuk 🇺🇦

Есть у компилятора опция init чтобы анимации сразу у нод проигрывались, а не после удаления из dom, но она работает только для всего приложения(на данный момент времени)

0

23.03.2021

Mark Tanashchuk 🇺🇦

Mark Tanashchuk 🇺🇦
Есть у компилятора опция init чтобы анимации сразу...

опция intro*

0

23.03.2021

Daniil Kozlov · Accepted Answer

Все верно поняли. Delay — это задержка применения анимации, прямо как в CSS. Да, нужен if-тег и интервал. Интервал рекомендую делать в onMount и возвращать стрелочную функцию, которая делает clearInterval. А вам точно нужно для этого JS юзать? Может, сойдет CSS-анимация, меняющая opacity элемента, но не убирающая его из дома?

169 похожих чатов

День добрый, господа и дамы Пытаюсь добавить эффект перехода к

4 ответов

Похожие вопросы