自定義const jurerryUI可拖拽

Question

我希望使用jqueryUI的可拖動小部件，但限制該對象，以便它綁定到瀏覽器的窗口的頂部，左側和右側。

但是，我想讓對象能夠拖動到窗口下方，直到只有30個像素的對象可見。在那一點上，我希望它不能再拖下去。所以，我希望對象的至少30個像素始終可見，因此仍然可以輕鬆地拖回到視圖中。

是否可以使用插件在約束上定義此類型？如果是的話，它是如何完成的？

Answer 1

可拖動的小部件有一個containment選項，可用於限制拖動元素可以拖動的限制。該選項可以取的值的數組，所以這樣的事情應該做的伎倆：

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

這裏是上面的working example。我已從document.height中減去70，因爲示例中的可拖動元素高爲100px。