Суть:
Есть проект, который находится на стадии разработки, это генератор веб-сайтов. Вот скриншот
priscree.ru/img/e02afabb18a9b3.jpg. Есть элемент output, в который добавляются все элементы, созданные пользователем. Этот самый output на скриншоте выделен синим border. Так вот, над этим output есть зеленые меню, высота которого 50px. Я хочу что бы output был всегда в поле зрения, то есть меню не должно перекрывать output.
Но тут возникает проблема! Видите этот элемент с надписью relative? Так вот, у него есть несколько функций, связынные с расчетом координат. Для примера возьмем самое простое - drag'n'drop. Так вот, если мы будем просто задавать позиционирование элементу с надписью relative (у него position:relative), то отсчет координат будет уже не от output, а от body! Соответственно при перетаскивании элемента, этот с
элемент будет под курсором на высоту меню!
Как мне быть? Кстати, если при расчетах просто тупо отнимать 50, то меня такое не устраивает, хоть и работает. Плагины, которые созданы мной, и использвуются в этом проекте будут, скорее всего, присутствовать и в других проектах, а я не думаю что там будет точно такое же меню. Вообщем что посоветуете?
Ладно, все таки выложу код:
https://jsfiddle.net/gkzkqk1b/1/show/- Для создания элемента - наведите на кружок и выберите необходимый элемент
- Для изменения размеров элемента, кликните на него (тут и будет проблема)
- Для добавления элемена в элемент, кликните на необходимый элемент и повторите шаг 1