Остановите jQuery, перетаскиваемый от прокрутки от экрана

При использовании jQuery UI, перетаскиваемого на элемент div, вы можете перетащить элемент "влево" с правой стороны страницы, но страница будет просто расширяться и автоматически прокручиваться вместе с элементом. Это проблематично, поскольку я пытаюсь инициировать событие, когда элемент достигает правой части окна. Одно предостережение в том, что я не могу просто связать div так, чтобы он не мог уйти, потому что я хочу, чтобы перетаскивание остановилось, когда ваш курсор встречает край, а не div (попробуйте перетащить его с левой стороны, чтобы посмотреть, что я имею в виду, я просто хочу чтобы воспроизвести это справа).

Что я пробовал:

body {overflow: hidden;} - на первый взгляд работает, но если вы проверяете, что тело фактически прокручивается, просто не с видимой полосой прокрутки. Плюс это должно быть использовано в плагине, поэтому я не могу ограничить пользователей только переполнением: скрытые bodys.

Создание обертки div размера окна/фиксированной позиции для запуска событий, но тело все еще распространяется только под фиксированным div.

Мне просто нужно сказать, что если я перетаскиваю элемент, не прокручивайте окно.

Вот jsFiddle, который позволяет перетаскивать, но выходит из окна: 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
}