jQuery UI Draggable with custom containment in a fixed parent

Question

I would like to have a constrained draggable in a fixed parent. When I scroll down the the containmet region moves together with the body and not with the fixed child. Is there a way to prevent this?

http://jsfiddle.net/fzSjx/7/

Html:

 <div id="o">
     <div id="draggable">
         <p>drag me</p>
     </div>
 </div>

JS:

$( "#draggable" ).draggable(
    { containment: [ 0 ,0, 200, 200], 
      scroll: false }
);

Css:

#o {
    position: fixed;
}
body {
    height:1000px;
}

Answer 1

Try position: absolute on #o . position: fixed will fix the position of the div in the viewport, position: absolute will fix the div relative to nearest relatively positioned parent.

EDIT:

You have the wrong value for containment, set it to be contained by its parent like this

$( '#draggable' ).draggable({
    containment: 'parent',
    scroll: false
});