jQuery UI 多个可排序列 : issue with scrolling

Question

jQuery:1.9.1

jQuery UI:1.10.1

Please See The Fiddle

            <td class="my-column" >
                <div id="my-div1" class="my-div-class">
                    <p class="para-item"> para 101 </p>
                </div>
            </td>
            <td>
                <div id="my-div1" class="my-div-class">
                    <p class="para-item"> para 201 </p>
                </div>
            </td>

<script>
    $(".my-div-class").sortable( { connectWith: '.my-div-class' } );
</script>

在 fiddle 中，当用户尝试将列表 1 中的顶部项目拖动到列表 2 的底部时，列表 1 的滚动条而不是列表 2 的滚动条被移动。

尝试了各种方法，但无法使其正常工作。非常感谢任何意见/建议。

谢谢，拉克什

Answer 1

如果您不想更改实际的 src 文件。有一个句柄作为选项的一部分

请参阅the fiddle

    sort:function(event,uiHash){

    var scrollContainer = uiHash.placeholder[0].parentNode;
        var overflowOffset = $(scrollContainer).offset();
    if((overflowOffset.top + scrollContainer.offsetHeight) - event.pageY < scrollingSensitivity) {
scrollContainer.scrollTop = scrollContainer.scrollTop + scrollingSpeed;
    } 
    else if(event.pageY - overflowOffset.top < scrollingSensitivity) {
        scrollContainer.scrollTop = scrollContainer.scrollTop - scrollingSpeed;
    }
    if((overflowOffset.left + scrollContainer.offsetWidth) - event.pageX < scrollingSensitivity) {
scrollContainer.scrollLeft = scrollContainer.scrollLeft + scrollingSpeed;
    } 
    else if(event.pageX - overflowOffset.left < scrollingSensitivity) {
        scrollContainer.scrollLeft = scrollContainer.scrollLeft - scrollingSpeed;

}
    }