vertical scrolling while dragging the element not works properly

Question

I am trying to make the page scroll when we drag element top or bottom of the screen. It working fine when container is inside the screen but unable to scroll when container is bigger than screen. To Solve this issue I have write this:

$('.dragable').draggable({

    zIndex:100,
    revert: "invalid",
    helper: "clone",
    scroll: true,
    drag: function(e)
    {
        if(e.clientY <= distance)//top
        {
            isMoving = true;
            clearInetervals();            
            intTopHandler= setInterval(function(){
                $(document).scrollTop(e.clientY - step)
            },timer);
        }
        if(e.clientY >= ($(window).height() - distance))//bottom
        {
            isMoving = true;
            clearInetervals();            
            intBottomHandler= setInterval(function(){
                $(document).scrollTop(e.clientY + step)
            },timer);
        }
    }
});

After releasing the draggable element screen stays at same position unless we move the draggable again. I have tried scrollBy instead of scrollTop method but its not working on mobile devices. Please suggest any help. Thanks

Answer 1

Remove clearIntervals and use scrollTop without setInterval given below

$('.dragable').draggable({

zIndex:100,
revert: "invalid",
helper: "clone",
scroll: true,
drag: function(e)
{
    if(e.clientY <= distance)//top
    {
        $(document).scrollTop(e.clientY - step)
    }
    if(e.clientY >= ($(window).height() - distance))//bottom
    {
        $(document).scrollTop(e.clientY + step)
    }
}

});

it is working fine