包含一個可拖動的div到父項

我正在使用jQuery UI可拖動庫。在點擊按鈕上，我可以創建文本並將其附加到新的div。但是我遇到了兩個問題：創建的新div不保留在父div中。換句話說，我如何將可拖動的div保存在父div div container內？第二，我設置了一個z-index以便能夠將一個div重疊在另一個之上。目前最新創建的div保持在最高。怎樣才能使div可以重疊，而不依賴於元素創建順序？ JSFIDDLE 包含一個可拖動的div到父項

jQuery的

var z = 1; //value to make div overlappable 

$('#addText').click(function (e) { 
    /** Make div draggable **/ 
    $('<div />', { 
     class: 'ui-widget-content', 
     appendTo: '.container', 
     draggable: { 
      containment: 'parent', 
      start: function(event, ui) { 
       $(this).css('z-index', ++z); 
      } 
     } 
    }); 
});

HTML

<div class="container"> 
<div data-bind="foreach:items" class="fix_backround"> 
    <div href="#" class="item" data-bind="draggable:true,droppable:true"> 
     <span data-bind="click:$parent.remove">[x]</span><br/><br/> 
     <center><span class="text" data-bind="text:$data"></span><input class="edit_text"/></center> 
    </div> 
</div>

來源

2014-09-01 techAddict82

我不明白你的第二個問題，你能解釋一下嗎？ – dashtinejad 2014-09-01 06:50:02

@ROX與此問題類似的功能（http://stackoverflow.com/questions/25589912/creating-overlapping-draggable-divs/25590022#25590022） – techAddict82 2014-09-01 06:52:56

對於你的第一個問題，請您.container元素position和overflow屬性：

.container { 
    position: relative; 
    overflow: auto; 
}

jsFiddle Demo。

來源

2014-09-01 06:48:07 dashtinejad

問題是，它允許可拖動的div滑入容器邊緣，它消失。我怎樣才能避免可拖動div的消失？ – techAddict82 2014-09-01 06:52:05

包含一個可拖動的div到父項

回答

相關問題