0

我有一个项目管理系统

有一些 div 是甘特图，它们是可调整大小和可拖动的，如何在Jquery UI上为红色潜水从左侧和顶部（出于限制）制作边框或区域？

这是我的甘特图： 甘特图

红色潜水（工作）不能比他们的父母（项目）向左和更高。 我不能用收容措施做到这一点

（两个红色潜水是工作，他们的父 div（绿色 div）是一个项目）

4

1 回答 1

2

在文档中，它说该containment属性的可能值之一是定义边界框的数组。所以不需要容器。

示例：Live Copy （请注意，“指南” div 仅用于显示框的位置，它不包含有界可拖动对象）

<!DOCTYPE html>
<html>
<head>
<link href="http://code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.min.css" rel="stylesheet" type="text/css" />
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script src="http://code.jquery.com/ui/1.10.4/jquery-ui.min.js"></script>
<meta charset=utf-8 />
<title>Containment Example</title>
  <style>
    div {
      display: inline-block;
      border: 1px solid #aaa;
      box-sizing: border-box;
    }
    div.guide {
      position: absolute;
      border: 1px dotted black;
      left: 10px;
      top: 0px;
      width: 190px;
      height: 200px;
    }
  </style>
</head>
<body>
  <div class="guide"></div>
  <div class="unbounded">I can go anywhere</div>
  <div class="bounded">I can only move around in the box
    <br>[10, 0] to [200, 200]</div>
  <script>
    $(".unbounded").draggable();
    $(".bounded").draggable({
      containment: [10, 0, 200, 200]
    });
  </script>
</body>
</html>
于 2014-03-13T14:53:33.800 回答