Jquery ui jQuery UI可拖动问题，带有包含选项

我试图在一个宽度相同的

div

中放置一个图像，以便在div的限制范围内拖动。这很难解释，但是图像的一侧（顶部或底部）可以离开div，但是图像的边缘和div的边界之间不能有间隙

要恢复，图像的宽度与父div相同，但其高度更大，因此图像的一部分被隐藏

我想做的是：

它工作得很好。。。因为div上面没有任何内容。如果文档和div之间存在间隙，它将不再工作。我认为

Draggable

将文档作为图像顶部的参考。一旦开始拖动图像，图像就会移动并将其上边缘粘贴到文档顶部：

我不知道如何使用

containment

选项实现这一点。 干杯

马克西姆

更新

---

另一次尝试相对定位，但没有成功：

我找到了一个解决方案，使用

offset（）

获得父div的顶部位置并将其添加到包含边界。我不确定这是不是最好的解决方案，但它看起来很有效

我只是在顶部的偏移量上有一个

1%

的差异，这很烦人：如果拖动图像并使其尽可能多地粘在顶部，它将返回

99%

偏移量，而不是

100%

（请参见控制台中的结果）

底部的一个是正确的（

0%

）。我想是因为尺寸太大了，但我不确定。 以下是JSFIDLE：

如果你有更好的主意，请告诉我

谢谢，马克西姆