Dragging a div through container with overflow.?

Question by Foofah: Dragging a div through container with overflow.?
Hey all,

I am looking for a JQuery solution for the following problem.

I have got two divs, one is a container with an overflow property and within that div another div which is bigger. I want to drag the underlying div through the top div. Example:

#container {
width: 300px;
height: 300px;
overflow: hidden
}
#dragdiv {
width: 700px;
height: 700px;
}

Basically I want to drag the image through the container with the dragdiv.

Best answer:

Answer by Jay Estux
You have to set the css property position to absolute and the you just modify the left and top css properties to position the image/div. You handle the onmousedown event set a boolean variable to true to indicate that dragging has started. on the onmousemove event you modify the left and top properties to move the image only if the boolean flag is true. You handle the onmouseup event to set the flag to false to indicate dragging has ended. The minor details you can figure out yourself.

Give your answer to this question below!

About Admin