CSS + JS Анимации

Столкнулся с такой проблемой: есть анимация с помощью transition и при определенных действиях нужно отключить transition с помощью JS сделать необходимые действия и вернуть transition.

Пример:

Есть слайдер и он анимируется с помощью "transition: transform .2s linear" в CSS, и когда доходит до последнего слайдера в JS должна быть функция отключения transition (element.style.transition = "none"), трансформация на первый слайд и возврат transition в исходное положения (element.style.transition = ""). Код:

element.style.transition = "none";
element.style.transform = `translate(0)`;
element.offsetHeight; // Разорвать триггер(не работает)
element.style.transition = "";

Нужно чтобы анимация выполнялась, но когда доходит до последнего слайда отключить анимацию перейти на первый и включить обратно. Работает через setTimeout с 0-1+ секундой задержки но это костыль скорее. Посоветовали разорвать триггер с помощью element.offsetHeight и т.д, но не работает. Хотелось узнать как по фэншую это можно сделать. Спасибо.


Ответы (0 шт):