jquery ui约束较小容器内的可拖动元素

Question

我试图将<img>拖动到具有固定宽度和高度的容器内。 我已经搜索了SO并找到了this，但它对我不起作用。

这是我想要达到的fiddle;有一个容器是我希望用户显示的图像的唯一部分，下面是一个可拖动的图像。它必须在.container元素中受到约束，具体取决于图像的方向，容器必须始终包含图像的一部分，而不是空白部分，换句话说，图像的边界必须始终保持不变在容器内。

我尝试使用包含属性，但我不明白数组选项的工作原理（http://api.jqueryui.com/draggable/#option-containment）。

Answer 1

$("img").draggable({
     containment: "parent" 
   });

并删除.active