jQuery UI多个可排序列:滚动问题 [英] jQuery UI multiple sortable columns : issue with scrolling

问题描述

jQuery:1.9.1

jQuery : 1.9.1

jQuery UI:1.10.1

jQuery UI : 1.10.1

请参阅小提琴

            <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>

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

In the fiddle, when user tries to drag top item in list-1 into bottom of list-2, the scroll bar of list-1 gets moved instead of list-2 scroll bar.

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

Tried various things but couldnt make it to work properly. Any inputs/suggestions are much appreciated.

谢谢， 拉克什

推荐答案

如果您不想更改实际的src文件.该选项中有一个手柄

If you don't want to change the actual src file. There is a handle as part of the option

请参见小提琴

    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;

}
    }

这篇关于jQuery UI多个可排序列:滚动问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！