javascript - 拖动 UI 可拖动元素时更新包含边界

Question

我有一个可以调整大小的 div，但我无法将可拖动元素拖动到新的边界中。那是因为在添加可拖动元素时设置的包含。每次拖动元素时都需要更新包含边界。

   <div class="parent">
      <div class="drag"></div>
   </div>

查询：

    $(".drag").draggable( {
                containment: ".parent",
                cursor: "move",
                stop: function ( event, ui ) {}
});

当我调整父 div 的大小并在 resize 之后拖动拖动元素时。我无法将元素拖到上一个区域之外。每次调整父 div 的大小时，如何更新包含边界？请帮帮我。

Answer 1

使用 jquery-ui-resizable 作为父级。

<div class="parent">
    <div class="drag"></div>
</div>

查询：

$(".parent").resizable();

$(".drag").draggable( {
    containment: ".parent",
    cursor: "move",
    stop: function ( event, ui ) {}
});