3

我正在起诉 jquery ui 可拖动到可以拖放到其他项目的 .droppable 列表中的项目列表上。这是一个jsFiddle来展示我正在尝试做的事情：

<div id="container">
<div id="left-pane" class="pane">
    <div class="item">Item A</div>
    <div class="item">Item B</div>
    <div class="item">Item C</div>
    <div class="item">Item D</div>
</div>

<div id="right-pane" class="pane">
    <div class="item">Item E</div>
    <div class="item">Item F</div>
    <div class="item">Item G</div>
    <div class="item">Item H</div>
</div>

​</p> 

$('.item').draggable({
    helper: 'clone',
    appendTo: '#contentpane',
    cursor: 'move'
});
$('.item').droppable();

窗格具有固定的高度，overflow-y: auto因此我们可以在内部滚动以查看隐藏的元素。

将一个元素从一个列表拖动到另一个时，列表不会滚动，因为我使用 appendTo 并且拖动的项目不在列表中。当我拖动一个项目时，有没有办法让列表“可滚动”？否则不可能将项目放在列表底部，比如说在小提琴示例中将“项目 A”放在“项目 H”上

4

2 回答 2

0

能够使用来自不同容器的滚动功能真的很不容易。

我打开了一个关于这个主题的话题。您将找到带有功能解决方法的问题的编辑。检查这个相关问题：JqueryUI, drag elements into a scrolling dropable div contains large table

关于您的最后一句话，您可以使用 sortable 属性将您的项目放在列表的顶部。http://jqueryui.com/sortable/

于 2012-11-22T06:45:52.623 回答
0

好吧，我发现这样做的唯一方法是检测拖动元素的位置并滚动可放置容器，并具有平滑的效果，以便它像从鼠标滚轮一样滚动。

于 2013-04-22T12:46:55.043 回答