停止 jQuery 可拖动滚动出屏幕

Question

当在 div 元素上使用 jQuery UI 可拖动时，您可以将元素 "off" 拖动到页面的右侧，但页面将简单地扩展和自动滚动元素。这是有问题的，因为我试图在元素到达 window 的右侧时启动一个事件。需要注意的是，我不能简单地绑定 div 以使其无法离开，因为我希望当您的光标遇到边缘而不是 div 时停止拖动（尝试将其从左侧拖动到明白我的意思，我只是想在右边复制它。

我试过的：

body{ overflow: hidden;} - 乍一看有效，但如果你检查关闭 body 实际上滚动只是不可见的滚动条。另外，这是在插件中使用的，所以我不能限制用户只能溢出：hidden bodys.

正在创建 window size/fixed 位置 的包装器 div 以触发事件，但 body 仍然延伸到正下方固定 div.

我只需要一种方式来说明如果我正在拖动一个元素，请不要滚动 window。

这是一个 jsFiddle，它允许拖动但不符合 window： http://jsfiddle.net/9dx1cxu8/

html:
<div class="box"></div>

javascript (jQueryUi):
$('.box').draggable();

css:
.box{
  left:200px;
  top:200px;
  width: 150px;
  height: 150px;
  box-shadow: inset 0 0 20px
}

Answer 1

请使用此代码：

$( ".box" ).draggable({ containment: "#containment-wrapper", scroll: false })

DEMO