UI draggable behavior issue

UI draggable behavior issue

There seems to be a bug with either my code or that of the draggable UI element. When I drag a draggable UI element onto a droppable element, the draggable item does not "stay in place", it "moves" across the screen and sometimes off the screen if, when I am placing it, I drag it further to the right.

My code is as follows:
  1. $('.draggable').draggable({
    grid: [1,1],
    cursor: 'move',
    revert: 'invalid',
    revertDuration: 1000,
    helper: 'clone',
        stop: function(event, ui)
    {
    $(ui.element).css({'position': 'static'}).css({'z-index': 1});
    $(ui.helper).clone(true).removeClass('box ui-draggable ui-draggable-dragging')
    .addClass('draggable-clone').appendTo('#droppable');
    }
    });

I am using jQuery 1.4.2 with UI 1.8. Am I doing something wrong?