Dragging an element outside of accordion menu in jquery with draggable?

i have been struggling with these problem all today. i added a draggable object inside a jquery accordion menu. the problem is it doesnt allow me to drag it outside. when i try to drag it outside it is resizing the div inside ac开发者_如何学Gocordion menu and showing scrollbar. here i made a demo of the problem. http://jsbin.com/efoje4/4

please help :(

in your draggable declaration, add the option appendTo:'body'

working example: http://jsbin.com/efoje4/6

see jQuery-Ui: Cannot drag object outside of an accordion

http://jsbin.com/efoje4/8/

You can use appendTo: 'body' which binds to object to the body of the page and not the current container element.