Анимация маленьких блоков

205

26 сентября 2018, 21:40

Имеется вот такой вот блок, задача состоит в том чтобы бирюзовые блоки перемещались на пустое место(пустое голубое пространство). Посоветуйте пожалуйста какой-нибудь плагин или же можете подкинуть идейку.

Answer 1

Поделим наше поле на квадраты и представим все это дело в виде матрицы (двумерного массива). 0 и 1 обозначают свободен или занят квадрат соответственно. По циклу проходим по массиву квадратов - содержит положение квадрата в матрице. Квадрат может двигаться в 4 направлениях. Генерируем рандомное число от 1 до 4. Запускаем js скрипт анимации квадрата (можно использовать jq animate и динамически менять свойства left и top), в матрице освобождаем занятую ранее клетку и занимаем новую. Картинка оживает.