可拖動的包含選項

Question

我指定可拖動的包含選項爲'文檔'，但可拖動的元素不能拖出容器。這是唯一可能的，如果我指定一個非常高的Z指數。這導致了一個奇怪的顯示（可拖動浮動其他頁面元素）。我必須指定將editdiv容器中可拖動的div可拖動到editdiv2容器的內容？

$(function() { 
    $("#editdiv").resizable(); 
    $("#editdiv").draggable(); 
    $("#editdiv").draggable("option", "handle", '#heading'); 
    $("#editdiv2").resizable(); 
    $("#editdiv2").draggable(); 
    $("#editdiv2").draggable("option", "handle", '#heading'); 
    $(".comurl").draggable(); 
    $(".comurl").draggable("option", "handle", '#dhandle'); 
    $("div.droppable").droppable({ 
     drop: function(event, ui) { 
      var $item = ui.draggable; 
      $item.fadeOut(function() { 

      $item.css({"left":"", "top":"", "bottom":"", "right":"" }).fadeIn(); 
     }); 
    $item.appendTo(this); 
     } 
    }); 

    $(".comurl").draggable({ containment: 'document' }); 

}); 

如果我改變圍堵「父」或「窗口」在容器中的可拖動的div似乎比如果我選擇「文件」更多的約束。

因爲我認爲z-index是個問題，所以我在css中設置了ui-draggable-dragging類的z-index。

.ui-draggable-dragging { 
    z-index: 999999; 
    background-color: red; 
} 

我必須修復哪些問題才能拖動元素div，例如， Facebook.com從第一個容器到第二個？我有一個jsfiddle在http://jsfiddle.net/gkvgn/8/。謝謝。

Answer 1

不得不移除overflow: hidden;

.link_drop_box{ 
     height:80%; 
     /* overflow:hidden; */ 
} 
.comdiv { 
     position:absolute; 
     padding: 0; 
     border: 1px solid DarkKhaki; 
     border-radius: 3px 3px 0px 0px; 
     box-shadow: inset 0px 0px 10px DarkKhaki; 
     /* overflow-y: hidden; 
     overflow-x: hidden; */ 
    } 

http://jsfiddle.net/gkvgn/10/。