5
我使用jQuery UI和jQuery draggable
,我所有的拖拽元素使用jquery 克隆助手並追加拖動到可放開。jQuery的拖拽元素和Droppables定位
這裏是我的代碼
$('#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);
,但位置是相對於身體。
該位置不是相對於可拖動的拖放到隨機位置的droppable。總而言之,可拖拽和可拖動的集成並不嚴密。我想讓它更平滑。
其中droppableOffset變量是jQuery('#squeezePage #droppable')。offset(); – Haris 2010-04-13 11:46:15
我花了很多時間尋找類似的解決方案..非常感謝。 – 2015-09-18 17:20:55