IK
Буду у компа, гляну как я делал и может накидаю идей
👍
Size: a a a
2020 March 01
IK
Павел, спасибо большое за помощь!
PM
Ivan Kuzmichov
Павел, спасибо большое за помощь!
👌
MF
Подскажите, есть tailwind + svelte. Как правильно занимировать яркость текста. Есть элемент, у которого стиль text-gray-800, нужно ему добавить text-gray-600, например, чтобы плавно якрость поменялась и через время снять класс, чтобы вернулось как было
T
Подскажите, есть tailwind + svelte. Как правильно занимировать яркость текста. Есть элемент, у которого стиль text-gray-800, нужно ему добавить text-gray-600, например, чтобы плавно якрость поменялась и через время снять класс, чтобы вернулось как было
transition добавить элементу, при изменении свойств будет анимироваться
MF
правильно ли добавлять классы через classList.add ?
MF
Чтобы запускать анимацию
T
правильно ли добавлять классы через classList.add ?
нет, через директиву класс добавляй
MF
у меня есть 30 элементов, например. и им по таймеру наугад нужно включить анимацию
MF
Как здесь через директиву правильно сделать
MF
назначить элементам какой-то айдишник и хранить отдельно текущий айдишник для анимирования, сверять с ним, при назначении класса?
T
ну либо айди анимируемого элемента, если анимируется всегда один, либо в массиве элементов хранить флаг активного класса
MF
спасибо, сейчас попробую. а как каждому элементу понять, что у него за айдишник?
MF
они генерируются через each
MF
ну т.е. как-то так вижу:
{#each}
<div class=“{thisId == activeId ? ‘one’ : ‘two’}” />
{/each}MF
activeId меняем где-то как хотим по какой-то логике, но как вот этот thisId для каждого элемента разным сделатьT
спасибо, сейчас попробую. а как каждому элементу понять, что у него за айдишник?
если нет айдишника, то индекс
{#each Array(10) as _, i (i)}
<div class:active={active===i}>
Text
</div>
{/each}MZ
ну т.е. как-то так вижу:
{#each}
<div class=“{thisId == activeId ? ‘one’ : ‘two’}” />
{/each}Можно же просто удалить класс анимации у всей группы через each и тут же следом навесить рандомно на любой элемент из группы. И не трахаться с активным элементом.
Или хранить отдельно активный элемент в переменной. Снимать класс с активного элемента и рандомно навешивать класс на любой элем из группы. Попутно сохраняя его в переменной.
Или хранить отдельно активный элемент в переменной. Снимать класс с активного элемента и рандомно навешивать класс на любой элем из группы. Попутно сохраняя его в переменной.
AS
Ivan Kuzmichov
Всем привет! Ребята, подскажите пожалуйста, я запутался в освоении. Есть песочница https://codesandbox.io/embed/amazing-booth-ml9l7
Подключил sortablejs, и пытаюсь сортировать карточки. Для примера, если первую карточку переместить в конец, а потом попытаться добавить новую, то если распечатать массив, новая карточка находится в конце, но при этом на экране он встаёт на предпоследнюю позицию. При сортировки плагином, вроде и сам массив сортирую, но не помогает.
Подключил sortablejs, и пытаюсь сортировать карточки. Для примера, если первую карточку переместить в конец, а потом попытаться добавить новую, то если распечатать массив, новая карточка находится в конце, но при этом на экране он встаёт на предпоследнюю позицию. При сортировки плагином, вроде и сам массив сортирую, но не помогает.
Накидал свой пример в Repl по работе с Sortable - стейт компонента синхранизируется при каждом событии сортировки. Кажется, проблем не заметил. https://svelte.dev/repl/3a5fae1be9c1458b85eef1e0591edeff?version=3.19.1