可排序列表重叠并防止拖放

Question

我在这里有一个jsfiddle，证明了我的问题。http://jsfiddle.net/j6um5/4/

<div id="list-A" style="height:50px; overflow-y:scroll; border:1px solid red">
<ul class="sortable">
    <li>item 1</li>
    <li>item 2</li>
    <li>item 3</li>
    <li>item 4</li>
    <li>item 5</li>
    <li>item 6</li>
    <li>item 7</li>
    <li>item 8</li>
    <li>item 9</li>
    <li>item 10</li>
    <li>item 11</li>
    <li>item 12</li>
    <li>item 13</li>
    <li>item 14</li>
    <li>item 15</li>
    <li>item 16</li>
</ul>

<div id="list-B">
<ul class="sortable">
    <li>item 4</li>
    <li>item 5</li>
    <li>item 6</li>
</ul>

这是JS

$(function() {
$('.sortable').sortable({
    connectWith: ".sortable",
    scroll:false,
}).disableSelection();

}）;

问题是sortable1（尽管DIV隐藏）仍然延伸至DOM中的sortable2。为了成功地将项目从List1拖到List2，您必须滚动到List1的底部，或者如果您向下滚动足够远，List1不是重叠的List2。任何工作都将不胜感激。

Answer 1

通过在实际的排序列表（UL）而不是包装器上设置高度/溢出，它似乎可以工作。

#sortable1 {
    height:25px;
    overflow-y:scroll;
    padding-bottom:35px;
}

请参阅此处：

http://jsfiddle.net/j6um5/8/

那是您要寻找的吗？