jQuery UI Draggable jumps at the first drag

问题:

Please refer to this jsFiddle example.

At the first time dragging the draggable, it jumps out of viewable area. Yet it is still draggable. It just doesn't stick to mouse cursor.

The following code is the main JS code I use.

$('.sortable').sortable({
    revert: true
});

$('.draggable').draggable({
    connectToSortable : '.sortable',
    revert            : 'invalid'
});