jQuery/jQueryUI Droppable的形状为Draggable

我有一个单独的列表，其中每个单元格都是可接受某个类的可拖动对象的可拖放对象。这张桌子的边框是可见的，但我不想要固定大小的单元格颜色和可见，这对我来说看起来很丑。当我拖动一个可拖动的元素到一个单元格的交叉点时，单元格会突出显示，这并不难，但我也希望这个突出显示的元素可以使用可拖动的大小。所有可拖动的都是固定宽度，但有些高度比其他高，所以调整高度就足够了，但我不知道从哪里开始。 Here是我正在寻找的适应类型的一个例子。jQuery/jQueryUI Droppable的形状为Draggable

来源

2013-02-12 Subhamoy Sengupta

我想提出一个疯狂猜测你的问题，但我需要看到一些代码来理解。你可以提供你的代码，或者在jsfiddle中描述它吗？ – 2013-02-12 11:42:51

为了您的要求，我建议您使用jQueryUI“Sortable”而不是Draggable/Droppable。请参阅portlets demo on the jQueryUI site，它应该是您正在寻找的功能。

编辑：@Subhamoy，我现在看到你的意思。下面是一个使用进行排序，并且依赖于CSS建表的解决方案： Link to jsfiddle

的关键部分是“过度”处理程序，需要调整占位符的护理：

$(".target .tbody").sortable({ 
    forcePlaceholderSize: true, 
    placeHolder: "ui-sortable-placeholder", 
    connectWith: ".source .tbody", 
    items: "> .tr", 
    over: function(event, ui) { 
     var $context = $(this) 
      ,$h = ui.helper 
      ,$p = $('.ui-sortable-placeholder', $context) 
      ,hheight = $h.height() 
     ; 
     $p.removeAttr("style"); 
     $p.css("height", hheight + "px"); 
    } 
});

来源

2013-02-15 15:46:48 marty

我看不出如何，因为不管可拖动的高度是多少，概述的可拖放区域总是相同的。 – 2013-02-16 17:06:01

@SubhamoySengupta，我已经链接到一个jsfiddle，希望能够符合您的要求。 – marty 2013-02-16 22:56:16

这真是太棒了，正是我想要的。非常感谢你，我很抱歉花了这么长的时间来接受它。我有一个问题。这可以使用固定的页眉或页脚单元并且列不可排序，以便添加到可拖放列只发生在底部而不是随机位置？ – 2013-02-19 11:05:36

jQuery/jQueryUI Droppable的形状为Draggable

回答

相关问题