切換div後失去過度效果（jQuery可拖動/可放置）

Question

我正在使用jQuery的可拖動和拖放功能來實現拖放功能： 有兩個選項卡，每個選項卡包含一個可放置區域拖拽元素。現在，我可以選擇可拖動的方式將其移動到其他選項卡 - 在拖動過程中移動選項卡時，選項卡會發生變化。 （就像MS WinExplorer，如果你將文件從一個目錄移動到另一個目錄....）。爲了表明用戶在可投放區域之上，我使用hoverClass選項。

問題：拖動期間多次更改選項卡後，懸停效果丟失。如果瀏覽器大小需要滾動條，並且我將帶有可拖動的指針移動到其中一個瀏覽器邊框（以便瀏覽器滾動），則會顯示懸停效果...。我已經將這個過度事件添加到droppable中，以檢查這是否總是被解僱 - 但並非如此。

$('.drag').draggable({ 
    revert: 'invalid', 
    helper: function() { 
     return $('<div></div>').addClass('drag-dragging').appendTo('body').text($(this).text()); 
    } 
}); 

$('#panel-1-droppable,#panel-2-droppable').droppable({ 
    accepts: 'drag', 
    hoverClass: 'panel-dropover', 
    over: function() { 
     // just to check the over-event 
     $('#over-state').text('Mouseover with draggable [' + $(this).attr('id') + ']'); 
    } 
}); 

$('.panel-tab').droppable({ 
    over: function() { 
     // changing tab... 
    } 
}); 

從來就創建了一個測試情景重現該問題：http://jsfiddle.net/CKYJs/5/

I'll希望從來就提供了所有必要的信息......

Answer 1

問題解決了在真實場景refreshPositions。

http://api.jqueryui.com/draggable/#option-refreshPositions