Как переместить элементы по координатам без position: absolute?

Question

[Кристина]

После определенных манипуляций, остаются несколько элементов в таблице и нужно, чтобы они перелетели в блоки под таблицей.

Они расположены хаотично, а нужно последовательно. Делать каждому элементу класс и анимацию делать не вариант, т.к. адаптив.

Можно ли сделать, чтобы был плавный перелет, например перемещением в DOM'e, как drag, только автоматически?

Я видела несколько примеров, как вычисляют текущие координаты эелементов, потом блоков и т.д. Но это просто нереально ёмко получается.
Без JQ.

Comments

[Vladimir]

Текущие координаты элементы можно взять из DOM с помощью js.

[Кристина]

Vladimir, Спасибо, я в курсе!)

Answer 1

[Владимир Проскурин]

Вообще, нетривиальная задача, поэтому готовое решение вы вряд ли найдете. Смотрите в сторону анимированных списков, такая конструкция вам подойдет. Например вот https://css-tricks.com/staggering-animations/ реализована анимация переноса элементов с одной таблицы в другую.

Comments

[Кристина]

Владимир Проскурин, Да, я не ищу лёгких путей) Учиться, так учиться) Спасибо за наводку, поковыряю код!

[Кристина]

Владимир Проскурин, Так-то трансформом я уже делала, конечно, получается прибито гвоздями. Думала, вдруг есть способ нативный в js.

[Владимир Проскурин]

Кристина, я не уверен, что такое существует. т.к. это не такая важная штука, чтобы ее внедрять. Хотя в Vue например внедрили https://ru.vuejs.org/v2/guide/transitions.html#lis...