jQuery Draggables 和 Droppables 定位
我正在使用 jquery UI 和 jQuery draggable，我的所有可拖动对象都使用 jquery clone 帮助器，并将 draggable 附加到 droppable >。
这是我的代码，
$('#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 设置克隆的位置); 但位置是相对于 BODY 而言的。
该位置与可放置对象无关，这使得可拖动对象放置到随机位置。总体来说，可拖拽的整合并不紧密。我想让它变得更顺畅。
I'm using jquery UI and jQuery draggable, all my draggables use jquery clone helper and appends the draggable to droppable.
Here is my code
$('#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,
});
}
});
I'm setting the position of the clone with .css('top', ui.absolutePosition.top); and css('left', ui.absolutePosition.left); but the position is relative to the BODY.
The position is not relative to the droppable which makes the draggable drop to random places. Overall, the droppable and draggable integration is not tight. I want to make it smoother.
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
我正在获取主体的偏移量，并从小部件克隆的偏移量中减去它。
有用！
I'm getting the offset of body and subtracting it from the offset of the widget clone.
It works!