在其父级中保留一个可拖动的div(Keep a draggable div inside its parent)

在其父级中保留一个可拖动的div(Keep a draggable div inside its parent)

我有一个可拖动的div标签。而且我想要拖动这个不会从其父项溢出的div。

<script> $('.children').resizeable().draggable();//from jquerUI </script> <style> .parent{ overflow: hidden; position: relative; width: 1000px; height: 1000px; } .children{ width: 100px; height: 100px; position: absolute; } </style> <div class="parent"> <div class="children"><div> </div>

我如何保持，限制孩子在父母的位置和大小。因为我的英语不好。

I have got a draggable div tag and I'd like it not to overflow from its parent while being dragged.

<script> $('.children').resizeable().draggable();//from jquerUI </script> <style> .parent{ overflow: hidden; position: relative; width: 1000px; height: 1000px; } .children{ width: 100px; height: 100px; position: absolute; } </style> <div class="parent"> <div class="children"><div> </div>

How can I limit the children's position and size inside the parent.

最满意答案

$('.children').draggable({ containment: "parent" }); $('.children').draggable({ containment: "parent" });