Изменить контейнер элементов без изменения положения элементов

Question

Изменить контейнер элементов без изменения положения элементов

0

Я перетаскиваю элемент из одного контейнера во второй контейнер (контейнеры независимы). При запуске перетаскивания я добавляю элемент перетаскивания в тело (это необходимо). Если я отбрасываю элемент во второй контейнер, я получаю координаты элемента относительно тела вместо второго контейнера, поэтому мой элемент появляется в неправильном месте во втором контейнере

Как я могу с этим справиться?

tgrabus 22 март 2014, в 13:31

Источник

Теги:

jquery

html

drag-and-drop

2 ответа

Ещё вопросы

tgrabus · Answer 1 · 2014-03-22T11-38-00.000Z

Html выглядит примерно так:

<div id="designer">  
   <div class="ui-layout-center">
     <div id="workspace"></div>
   </div>

   <div class="ui-layout-north">
     content
   </div>

   <div class="ui-layout-west">
     <div class="elements">
        <div class="element"></div>
        <div class="element"></div>
     </div>
   </div>
</div>

CSS

#workspace {
   position:relative;
}
.work-element { /*class for dropped element*/
  position:absolute;
}

JS

$('.elements .element').draggable({
    helper: copyElementHelper
});

$("#workspace").droppable({
    accept: '.element',
    drop: onWorkspaceDrop
});

function copyElementHelper(event) {
    var $element = $('<div></div>');

    return $element.appendTo('body').css('zIndex', 5).show();
};

function onWorkspaceDrop(event, ui) {
    // logic for adding element to workspace
    // create element
    // add class work-element to created element
    // set positions for created element using ui param
    // here I have position relative to body
    // how to transform it to be position relative to workspace
};

Mortaza · Answer 2 · 2014-03-22T10-09-00.000Z

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