Есть ли готовое решение на js для разлета и столкновений содержимого внутри блока?
Очень сомнительно, что такое на css возможно, но мало ли. Суть в том, что нужно чтобы при клике в определённом блоке внутри которого есть еще разные блоки, они все начинали разлетаться внутри него и биться об границы, сталкиваться друг с другом. Существуют ли уже готовые решения такого рода?
UPD: Немного поразмыслив над данным вопросом в голове есть пару идей от которых пока отталкиваюсь. Основная это определить позиции каждого из элементов в блоке и задать ему абсолютную позицию. Соответственно дальше уже изменять его положение в неком рандомном направлении (тут возникает вопрос как создать данное направление, не могу же я использовать градус относительно оси. Соответственно нужно написать формулу по типу 1px left 1px top в интервал для первого элемента, что вроде как равноценно -45 градусам относительно вертикальной оси и так поочерёдно для всех элементов но в других направлениях. Тогда возникает вопрос смены направления при столкновении с границами. По сути я могу просто изменить направление на 90 градусов таким же методом, изменяя сами стороны, но как определить в какую именно сторону нужно произвести изменение. Тоесть мне нужно ведь определить под каким углом я столкнулся с определённым краем. Ну и ко всему прочему провести всё тоже самое и по отношению к столкновению между объектами. Но тут у меня вообще идей нет как им "полигоны" эмитировать).
Но это же всё канвас. Я с ним знаю как это сделать. Я наверное не чётко сформулировал. У меня есть готовое dom дерево и в одном из div блоков, находятся другие div содержащие картинки, тексты. Манипулировать нужно ими.
Stalker_RED, я так и не понял фокуса, как я могу это сделать без канваса на js. Как я уже написал у меня уже сформированная, свёрстанная страница и мне нужно манипулировать её элементами. Может я что-то не так понял и я могу каким либо скриптом заставить всё это перенестись в канвас, набросить его на место этого блока и произвести эту магию всю по клику. Но по текущим данным я понял это так. Мне нужно всё заново построить на канвасе, а это мне не подходит
Юрий Янин, если открыть box2d-js.sourceforge.net/index2.html и поскроллить вниз, то можно увидеть пример кода.
Он разбит на пять блоков.
Только в последнем, пятом блоке используется canvas для отображения.
Расчет физики происходит без всяких канвасов.
Никто не мешает вам вместо рисовки на canvas двигать dom-элементы.
Простой
