我有一个可拖动的对象(div),以及一些可放入的对象(表TD)。我希望用户将我的可拖动对象拖到其中一个可拖放的TD中。
我这样启用了draggable和droppable:
$(".draggable").draggable();
$(".droppable").droppable();
问题是,这样用户就可以将div拖到屏幕上的任何位置,包括拖出可放放区域。
如何限制可拖动对象的边界区域?
发布于 2010-07-13 20:52:17
使用“容纳”选项:
jQuery UI API - Draggable Widget - containment
文档说它只接受值:'parent'
,'document'
,'window'
,[x1, y1, x2, y2]
,但我记得它也会接受选择器,比如'#container‘。
发布于 2013-03-15 04:28:24
$(function() { $( "#draggable" ).draggable({ containment: "window" }); });
不显示此代码的。完整代码和演示:http://www.limitsizbilgi.com/div-tasima-surukle-birak-div-drag-and-drop-jquery.html
为了将元素限制在其父元素内:
$( "#draggable" ).draggable({ containment: "window" });
发布于 2012-10-30 04:53:15
下面是一个代码示例。#缩略图是#handle DIV的DIV父级
buildDraggable = function() {
$( "#handle" ).draggable({
containment: '#thumbnail',
drag: function(event) {
var top = $(this).position().top;
var left = $(this).position().left;
ICZoom.panImage(top, left);
},
});
https://stackoverflow.com/questions/3237161
复制相似问题