jQuery Draggables и Droppables Позиционирование - PullRequest
Новая
       34

jQuery Draggables и Droppables Позиционирование

5 голосов
/ 13 апреля 2010

Я использую пользовательский интерфейс jquery и jQuery draggable, все мои перетаскиваемые объекты используют помощник jquery клон и добавляет перетаскиваемый к * * * * * * * Вот мой код 

 $('#squeezePage #droppable').droppable({
  tolerance: 'fit',
  accept: '#squeezeWidgets .squeezeWidget',
  drop: function(event, ui) {
   var dropElem = ui.draggable.html();

   var clone = $(dropElem).clone();

   clone.css('position', 'absolute');
   clone.css('top', ui.absolutePosition.top);
   clone.css('left', ui.absolutePosition.left);

   $(this).append(clone);

   $(this).find('.top').remove();
   $(this).find('.widgetContent').slideDown('fast');

   $(this).find('.widgetContent').draggable({
    containment: '#squeezePage #droppable',
    cursor: 'crosshair',
    grid: [20, 20],
    scroll: true,
    snap: true,
    snapMode: 'outer',
    refreshPositions: true
   });

   $(this).find('.widgetContent').resizable({
    maxWidth: 560,
    minHeight: 60,
    minWidth: 180,
    grid: 20,
   });
  }
 });

Я устанавливаю позицию клона с помощью .css('top', ui.absolutePosition.top); и css('left', ui.absolutePosition.left);, но позиция относительно ТЕЛА.

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

1 Ответ

10 голосов
/ 13 апреля 2010

Я получаю смещение тела и вычитаю его из смещения клона виджета. 

        clone.css('top', ui.position.top - droppableOffset.top);
        clone.css('left', ui.position.left - droppableOffset.left);

Это работает!

...