如何阻止Div移出边界Jquery draggable();

Question

如何阻止div移出边界div

这是我到目前为止的代码.

  <script>
 $(document).ready(function() {
 $("#draggable").draggable({ grid: [50, 20] });
  });
  </script>
  <div id="drag_border">
  <div id="draggable" style="width:500; height:800">Drag me</div>
  </div>

谢谢,

Answer 1

你需要使用containment.例如

$("#draggable").draggable({
  grid: [50, 20],
  containment: 'parent'
});

编辑:

这是一个例子.

请记住,您使用的是网格,因此除非计算框的宽度和高度以匹配该网格,否则您将无法到达边缘.