使div可拖动和可放置某些元素
问题描述:
我有一个可拖动和放置div的页面。每个div包含可拖动的嵌套div。我想能够从div 1拖动嵌套的div并将它们放在div 2上,也可以通过其他方式。我试图做的jsfiddle是在这个链接http://jsfiddle.net/fWhDn/使div可拖动和可放置某些元素
如果我将msn.com链接(draggable div)从div 2移动到div 1,则不会将其放入该div。为了获得正确的行为,我必须做些什么?即,哪些链接成为div 1的一部分?
答
为了得到这个工作,你必须将可拖动的div附加到相应的可拖动div上。您可以通过droppable init中的drop事件来完成此操作。我为每个droppable div设置它以访问$(this)。重置项目的CSS也很重要,就好像它不会占据它在拖动它时的位置。以下是我加:
$("#editdiv .droppable").droppable({
drop: function(event, ui) {
var $item = ui.draggable;
$item.fadeOut(function() {
$item.css({"left":"", "top":"", "bottom":"", "right":"" }).fadeIn();
});
$item.appendTo(this);
}
});
$("#editdiv_ .droppable").droppable({
drop: function(event, ui) {
var $item = ui.draggable;
$item.fadeOut(function() {
$item.css({"left":"", "top":"", "bottom":"", "right":"" }).fadeIn();
});
$item.appendTo(this);
}
});
而这里的更新小提琴:http://jsfiddle.net/TpbZk/
感谢固定我的代码。 – user823527