jquery - jquery ui 可拖动遏制是如何工作的？

Question

编辑我终于弄清楚了我的网站上遇到的问题，在这个例子中得到了演示:http://jsfiddle.net/DerNa/10/ 。您在这里看到的是 #frame 容器从 0/0 位置移动(到 50/50 位置)。由于某种原因，图片是相对于“窗口”而不是相对于父容器的。有谁知道我如何使其相对于父容器？

老问题如下

我不知道这是如何工作的，例如:http://jsfiddle.net/DerNa/4/

基本上，我的问题来 self 在网上找到的内容，以及我通过示例可以推断出的内容是 [container_width-image_width，container_height-image_height，？ ？]。前两个是您希望可拖动内容包含在的不可见容器的左边缘和上边缘，这是有道理的。但是，我不确定最后两个值是如何工作的，它们要么是右/下，要么是宽度/高度，但在提供的示例中似乎都没有多大意义。

如果有人能对此有所了解，我们将不胜感激!

杰森

Answer 1

每http://api.jqueryui.com/draggable/#option-containment

遏制:

Constrains dragging to within the bounds of the specified element or region. Possible string values: 'parent', 'document', 'window', [x1, y1, x2, y2].

所以数字是 X,Y 格式的起始和结束坐标。在你的 fiddle 中，你有:

containment:[-500,-127,0,0]

翻译为-500、-127和0,0。因此，基本上，包含设置为起始位置左侧 500 像素、上方 127 像素的位置，结束包含为 0,0，或者更确切地说是图像最初所在的位置。