Question

I would like to create a big draggable element and put it into a smaller container that limits its movement, so 2 of the draggable sides must touch the container/container’s sides.

I also want that the draggable object will be draggable from anywhere in the frame, and not only while clicking on the object itself.

I saw that jQuery provides a nice draggable object:
http://docs.jquery.com/UI/Draggable

Here is an example I made of what is allowed and what is not:

Answer 1

You should set the containment to that object like following:

$(".selector")
             .draggable({ 
               containment: "parent"
             });

Here is doco