Child nodes not go out of the parent div

问题

I have this div:

<div id="composition_area" style="width: 700px; height: 600px; float:left; border: solid 2px">
            <div id="a" class="a window" style="width: 80px; height: 80px; border: solid 1px" contenteditable="true">foo</div>
</div>

and inside of this with id="composition_area" I add nodes with the jsplumb. In this example I have a node with id="a". All the nodes are draggable and the user can move the divs anywhere he wants. But I want not to go out of the parent div. How can I do that?

回答1:

Look at the doc http://jsplumbtoolkit.com/doc/home#dragging

A common request is for the ability to contain the area within which an element may be dragged. For jQuery this is as simple as providing a containment parameter:

jsPlumb.draggable($("someSelector"), { containment:"parent" });

try this :

jsPlumb.draggable($("#composition_area"), {
  containment:"parent"
});

来源：https://stackoverflow.com/questions/19792233/child-nodes-not-go-out-of-the-parent-div