Dragging a div along with all of its child divs
- by roygbiv
I have the following code:
<body>
<div id="container" style="position:absolute; left:0px; top:0px; z-index:1;">
<div id="div1" style="background-color:Red; position:absolute; left:0px; top:0px; width:256px; height:256px; z-index:0;" > </div>
<div id="div2" style="background-color:Black; position:absolute; left:256px; top:0px; width:256px; height:256px; z-index:0;" > </div>
<div id="div3" style="background-color:Green; position:absolute; left:512px; top:0px; width:256px; height:256px; z-index:0;" > </div>
<div id="div4" style="background-color:Yellow; position:absolute; left:768px; top:0px; width:256px; height:256px; z-index:0;" > </div>
<div id="div5" style="background-color:Blue; position:absolute; left:1024px; top:0px; width:256px; height:256px; z-index:0;" > </div>
</div>
<script type="text/javascript">
<!--
SET_DHTML("container");
//-->
</script>
</body>
I want to drag the 'container' div such that all child divs are dragged at the same time. I can drag individual divs, but that is not what I want. Can a div drag child divs or do they have to be images?
I am using the WalterZorn drag drop API, but am open to using any API, script or whatever.