Пользовательский, содержащий перетаскиваемый jquerryUI

Question

Я хочу использовать перетаскиваемый виджет jqueryUI, но ограничить объект так, чтобы он был связан с окном браузера сверху, слева и справа.

Но , я хочу, чтобы объект мог перетаскивать под окном вверх, пока не будет видно только 30 пикселей объекта. В этот момент я бы хотел, чтобы он не двигался дальше. Итак, я хочу, чтобы по крайней мере 30 пикселей объекта всегда были видны, так что все еще легко перетащить обратно в поле зрения.

Можно ли определить этот тип в ограничении с помощью плагина ?, Если да, то как это делается?

Answer 1

Перетаскиваемый виджет имеет параметр containment, который можно использовать для ограничения пределов, в которых перетаскиваемый элемент может быть перетаскиваться. Эта опция может принимать массив значений, поэтому что-то вроде этого должно сработать:

$("#example").draggable({
   containment: [0, 0, document.width, document.height - 70]
});

Вот рабочий пример из вышеперечисленного. Я вычел 70 из document.height, потому что перетаскиваемый элемент в примере 100px в высоту.