將jQuery的可拖動出它的父jQuery的對話框

Question

我有一個充滿了可拖動對象jquery的對話框。可放下的目標在對話框之外。

當我發起拖動，可放開正確響應（視覺跡象表明，這是一個投擲的目標）和掉落正確的事件觸發，所以我可以正確處理後回落。

的問題是，拖動的對象只有在對話中保持可見，並沒有「跳出來」。

我已經從一個滾動的div到另一個拖動沒有問題拖拽元素，但是從包含對話的對話頁面這是行不通的。對話內容以任何方向滾動。

我可拖動的參數如下：

var draggableArguments={ 
    revert: 'invalid', 
    helper:'clone', 
    containment: 'DOM', 
    zIndex: 999, 
    addClasses: false 
    } 

    theObject.draggable(draggableArguments); 

任何建議，使我可拖動對象可以跨越邊界的對話？

謝謝。

Answer 1

固定，實際上很簡單。

我只需要使用appendTo選項上拖動，這樣助手被追加到元素，我希望它拖動（例如#page，涵蓋我的網頁一個div）。這會將其從對話框中移除（它具有「overflow：auto」屬性，該屬性添加了滾動條來擴展畫布，以便拖動元素始終在內）並將其附加到#page元素。

唯一的問題是我的對話框有一個相當高的zIndex的，所以我只是遞增zIndex的選項要高。

var draggableArguments={ 
    revert: 'invalid', 
    helper:'clone', 
    appendTo: '#page', 
    containment: 'DOM', 
    zIndex: 1500, 
    addClasses: false 
} 

theObject.draggable(draggableArguments); 

Answer 2

你必須這樣做：

 
$('.my_draggable').draggable({ 
    helper:'clone', 
    appendTo: 'body', 
    scroll: false 
});