Handling Scroll bars with jQuery event Drag and Drop

Question

I have a room div with some toy divs arranged on it, see

Toys are absolutly positioned and are drag-able with in the walls of the room . The room container div has a fixed height and height, so the room has horizontal as well as vertical scrolls. I use jquery event drag plug-in for setting up DnD. I managed to set up the toys drag only with in the lomits of the wall, but when there are scrolls, component is moving a little ouside the wall (only up to the actual width of the wall).

I want to show only a portion of the toy as shown below

I tried setting the z-index, but has no effect, any one has better idea?

Answer 1

Withouth seeing the actual code, i guess overflow:hidden could solve this?

Answer 2

You can used scrollTo plugin http://demos.flesler.com/jquery/scrollTo/ to work with scrollbars