Question

How will I drag my items out of #draggable div with overflow:auto? Example below.

http://jsfiddle.net/7rmY3/1/

Answer 1

using the option:

'helper':'clone'

seems to let user dragg the item out

http://jsfiddle.net/7rmY3/5/

Edit,

If you need the dragged items removed, do it in the drop event of the droppable method. I applied an index id to identify the items, but this can be made different ways

$('#target').droppable({
    drop: function(event,ui){
               // Append the item in the droppable div
               $(this).append($(ui.draggable));       
               // Remove the item from the draggable list     
               $('#draggable li#'+$(ui.draggable).attr('id')).remove();
           }
});

http://jsfiddle.net/7rmY3/14/