Прилипающие блоки
В проекте реализовано сложное взаимодействие множества объектов.
1) На основе готового проекта - перемещаемый блок
2) На листе 5 блоков (до 10).
3) При нажатии на область с буквой Д в объект JS добавляется указатель (добавляется свойство) на этот блок.
4) объект JS запоминает указатели на блоки на которых нажали Д и забывает те на которых нажали У
5) блоки можно переносить - те указатели на которые есть в объекте JS
6) блокам можно изменять размер - те указатели на которые есть в объекте JS
7) Если при отпускании кнопки мыши при переносе или изменении размера, рядом (до 20 px) оказался другой блок то переносимый (изменяемый блок) прилипает к ближайшему соседнему.
8) Ширину зоны прилипания можно изменять - передать параметр в объект JS - единое значение по вертикали и горизонтали
9) При необходимости - код для перемещаемого блока можно менять
готовый проект - перемещаемый блок
1) элемент помеченный буквой Ф - активная зона для перемещения блока, нажали мышкой и понесли
2) элемент помеченный буквой О - активная зона изменения размера по высоте и ширине, нажали мышкой и изменяем размер.
3) минимальные размеры блока 300х200px
4) блок не может выходить за размеры экрана
5) если при переноске блок достигает границы, то он сначала уменьшается в размере до минимальной величины в этом направлении, а потом перемещение останавливается.
Поясняющие рисунки во вложении
Логика и обработка событий реализованы в одном объекте JS (функции)
сам готовый проект - архив проекта
Бюджет: 1800 RUB Срок: 2 дня
Доброго времени суток. Предлагаю Вам свои услуги по разработке.
Работаю с:
* WordPress
* Laravel, Yii/Yii2
* HTML, JS, CSS, jQuery
* Node.js, Express.js, EJS
* Vue.js
* Data Parsing
Сделаю в срок, как положено, соблюдая стандарты систем программирования.
Криптовалюта и blockchain 22 ставки 1 августа
Веб-программирование 67 ставок 29 июля
HTML и CSS верстка 16 ставок 23 июля