Draggable Containment

Draggable Containment


Hi there!
I was trying to use a image of about 500x500 pixels inside of a <div>
with hidden overflow and 300x300 width/height. When I set $
("#myImage").draggable({ containment: 'parent' }); and I try to drag
that, it will kind of center the image and keep it held there still.
If you have a bigger container than the draggable object, the
containment works fine, but when the opposite is true the containment
won't work as expected (maybe as I expect would be the correct
statement here).
So far, what I did to get this behavior without hacking the
draggable.ext file was not use the containment option and set a drag
function that inspects current ui.position.top and left and if it is
either positive or higher negative than the container + the object's
top/left then I will set ui.draggable.pos values to reflect the limits
and make it feel contained.
If the developer's team has interest on having this incorporated to
containment option, I guess the trick is to detect whether the
container is smaller than the object contained and apply this logic
above. If the current behavior is expected to stay as is, other way
would be explicitly have a third option like 'smallerParent' or a more
creative one.
I could write this patch both ways if everyone likes and agree to add
that functionality to containment option.
Thanks!