jQuery UI-如何计算可拖动的'；s"；遏制；？添加了jsfiddle

我有一个小容器和一个大的，可变大小的（图像是用户提交的）图像在里面，我想拖。我使用jQueryUI的“可拖动”功能进行垂直拖动，效果很好，但我遇到的唯一问题是，您可以将图像向上或向下拖动足够远，以便显示其边缘，并且可以在容器中看到其上方或下方的空白。我希望它能够正常工作，例如，当图像的下边缘碰到容器的下边缘时，您不能再将其向上拖动

我正试着使用

{ containment:[x1, y1, x2, y2] } 

选项，经过大量的尝试和错误，我可以为不同大小的图像计算正确的值，但我无法找出图像大小和包含值之间的函数关系。有谁能帮我解决问题，或者给我指出正确的方向，让我知道形象的大小和包容应该是什么样的关系？容器的固定尺寸为360x240。非常感谢

---

JSfiddle：我不希望容器中出现任何空白，也就是说，你不能将图像上下拖动到足够远的地方，让它发生。我尝试设置包容：“父对象”并且它不再滚动？

添加

id

ro您的图像并像这样使用

包容

：

$（“#容器img”）.可拖动({
包含：[$（'#myImage'）.width（）*-1，$（'#myImage'）.height（）*-1,0,0]
});

要解决此问题，您应该使用：

{containment:[x1，y1，x2，y2]}

$("#container img").draggable({
    containment: [(parseInt($("#myImage").width()) - parseInt($("#container").width())) * -1, 
                  (parseInt($("#myImage").height()) - parseInt($("#container").height())) * -1, 0, 0]
});

x1

=-（img.width-container.width）

y1

=-（img.height-container.height）

x2

=0

---

y2

=0

你能发布一些JSFIDLE来显示你的问题吗？你想这样裁剪图像吗我不想裁剪它-我正在做一个预览功能（比如FB的封面照片，你可以在保存之前重新定位图像）。这对我不起作用-问题是你可以将它向上或向下拖动足够远，以便显示容器中的空白。我希望它在那之前停止拖拉。谢谢！不幸的是，尽管它可以在JSFIDLE上工作，但在我的实际代码中却不起作用……是时候进行一些调试了：）@user1436111欢迎使用。将答案标记为已接受，或/或如果有帮助，则进行投票。我强烈建议你确保你的元素有好的选择器。浏览器的开发工具非常有用。

$("#container img").draggable({
    containment: [(parseInt($("#myImage").width()) - parseInt($("#container").width())) * -1, 
                  (parseInt($("#myImage").height()) - parseInt($("#container").height())) * -1, 0, 0]
});