JQuery UI：可拖動不能恢復到原始位置

Question

css位置top每次拖動或刪除拖動時都會增加大約10px。例如，

我第一次拖動蘋果從.sidebox到.dropbox，蘋果最終是這樣的：

<div class="apple ui-draggable selected" style="position: relative; left: 0px; top: 10.1px;"></div> 

第二次，我拖累了蘋果從.dropbox回.sidebox或只是輕微移動它，讓它恢復，蘋果就是這樣的，注意top增長了10：

<div class="apple ui-draggable selected" style="position: relative; left: 0px; top: 20.1px;"></div> 

重複拖和下降，top變得越來越大：

<div class="apple ui-draggable selected" style="position: relative; left: 0px; top: 30.1px;"></div> 
... 

因此，我親愛的蘋果正在從我想要的位置飄過，直到它向頁面說再見。這是什麼原因？

簡化代碼：

// drag and drop 
    $(".apple").draggable({ 
     revert:true 
    }); 

    $(".dropbox").droppable({ 
     drop: handleDropbox 
    }); 

    $(".sidebox").droppable({ 
     drop: handleSidebox 
    }); 

    function handleDropbox(event, ui) { 
     $(this).append(ui.draggable); 
     $(this).droppable('disable'); 
    } 

    function handleSidebox(event, ui) { 
     ui.draggable.parent().droppable('option', {'disabled':false}); 
     $(this).children('h4').after(ui.draggable); 
    } 

編輯：在的jsfiddle不能複製它，還沒弄明白爲什麼..

注意.sidebox位置是固定的，可以幫助？

Answer 1

請檢查小提琴

http://jsfiddle.net/4gFqh/7/

$(".apple").draggable({ 
    revert:function(event,ui){ 
     s=s+10; 
     alert("my top position is "+s); 
     $(this).data("draggable").originalPosition = { 
          top:s, 
          left:0 
             }; 
        return !event; 
          }, 
});