jquery ui sortable child items with sortable parent item scroll issue for window auto scroll

jquery ui sortable child items with sortable parent item scroll issue for window auto scroll

Hi,

I am using jquery ui sortable to apply the sortable feature into our application.

I have sortable parent items with sortable child items.

I am facing problem when we start to sorting the child items then window not auto scroll for next siblings item but it will work fine on parent sortable items.

i write some code on sort event to achive this

CSS:
.left-handle{
    background: red none repeat scroll 0 0;
    height: 100%;
    opacity: 0.5;
    position: fixed;
    width: 15px;
    z-index: 999;
    top:0;
    bottom:0;
    left:0;
}
.right-handle{
    background: red none repeat scroll 0 0;
    bottom: 0;
    float: right;
    height: 100%;
    opacity: 0.5;
    position: fixed;
    right: 0;
    top: 0;
    width: 15px;
    z-index: 999;
}

.handle-touched{
    background: green none repeat scroll 0 0;    
}

JS:
sort: function (event, ui) {    
    if (event.pageX >= $scope.left_pos) {
        $scope.disableLeftRightHandle('left'); // code for disable handle as per direction
    } else {
        $scope.disableLeftRightHandle('right');
    }
    if (jQ('.left-handle').hasClass("handle-touched")) {
        jQ('.right-handle').hasClass("handle-touched");
        scrollToLeft();        
    }
    if (jQ('.right-handle').hasClass("handle-touched")) {
        jQ('.left-handle').hasClass("handle-touched");
        scrollToRight();
    }
}

function scrollToLeft() {                  
    jQ("html,body").animate({
        scrollLeft: "-=10",
    }, 200, function () {
        // Animation complete.
    });
}
function scrollToLeft() {                  
    jQ("html,body").animate({
        scrollLeft: "-=10",
    }, 200, function () {
        // Animation complete.
    });
}
$timeout(function () {
    $scope.left_pos = event.pageX;                
}, 50);    
//$scope.left_pos = event.pageX;         

it works fine on browser but not working on mobile and touch devices.

i think the issue happen because of the following assigning new value to old one

$timeout(function () {
    $scope.left_pos = event.pageX;                
}, 50);    
//$scope.left_pos = event.pageX; 

i don't know whats going wrong there.

please suggest the solution for it