Javascript jQuery UI可拖动-滚动垂直和水平问题

技术：html、css、javascript、jquery和jQueryUI

小提琴url:（点击跑步按钮）

嗨，我有一个div（父div）和父div内的3个列表（ul）。 这3个列表是相同的（css和html元素） 使用jQueryUI，我可以对列表进行排序和连接（您可以在列表之间对元素进行排序）

html是

<div class="parent">
<ul  class="list l1">
  <li class="ui-state-default">Item 1</li>
  <li class="ui-state-default">Item 2</li>
  <li class="ui-state-default">Item 3</li>
  <li class="ui-state-default">Item 4</li>
  <li class="ui-state-default">Item 5</li>
</ul>
list2.... 
list3....
</div>

列表元素具有下一个css：

width: 400px;
border: 1px red solid;
height: 300px;
white-space: nowrap;
overflow-x: auto;

width: 200px;
display: inline-block;
border: 1px solid blue;
height: 160px;
overflow-y: auto;
overflow-x: hidden;

而js是：

$( ".l1, .l2, .l3 ").sortable({
    connectWith: ".list"
}).disableSelection();

问题： 卷轴，当我从列表1中获取一个元素并想将其放入列表3时，来自父div的卷轴（红色边框）不起作用（水平问题）

而且，当我从列表1中获取一个元素，并且我想把它放在列表2的末尾时，列表2中的滚动条不起作用（垂直问题）

有人能帮我解决这些问题吗

非常感谢

---

问候。

在这里，我提出了一个可能对您有所帮助的概念

---

换句话说，您希望它在拖动时自动滚动？看起来您必须编写一个自定义方法来跟踪元素相对于其他列表的位置。我建议在事件上使用

；这相当于
draggable
对象的
draggable
事件。这并不完美，但它可能会给您一个方向的想法。谢谢，这是一个很好的示例，我将尝试实现类似的内容。这是一个完整的解决方案。非常感谢。
# Stackoverflow required me to add some code, so I did.