Drag & Drop: Drag Constrained to a Region
This example shows how to constrain a draggable Node to another Nodes region.
Setting up the Node
First we need to create the HTML structure used in this example.
Now we give the Nodes some CSS to make them visible.
Setting up the YUI Instance
Now we need to create our YUI instance and tell it to load the dd-constrain module (that will load the dd-ddm and dd-drag modules too).
Making the Nodes draggable
Now that we have a YUI instance with the dd-constrain module, we need to instantiate the Drag instance on the Nodes.
Constrain the Nodes to other Nodes
Now that we have the Nodes draggable, we need to constrain them. We can do this by plugging the DDConstrained on to the Drag instance and passing it a config option called constrain2node and giving it a selector string of the Node we want to constrain to.