Как использовать JQuery / Javascript для прокрутки страницы вниз, когда курсор находится у верхнего или нижнего края экрана?

Просто, Я бы просто хотелось бы, чтобы когда пользователь перетаскивал элемент и он достиг самого низа или верха области просмотра (10 пикселей или около того) , страница (около 3000 пикселей в длину) плавно прокручивалась вниз или вверх, пока они не переместят свой курсор (и, следовательно, перетаскиваемый элемент) из области .

Элемент - это тег li, который использует jquery для перетаскивания элементов списка.Чтобы быть конкретным:

• ../jquery-ui-1.8.14.custom.min.js
• http://code.jquery.com/jquery-1.6.2.min.js

В настоящее время я используйте window.scrollBy (x = 0, y = 3) для прокрутки страницы и укажите следующие переменные:

1. e.pageY ... обеспечивает абсолютные координаты Y курсора на странице (не относительно экрана)
2. $ .scrollTop () ... обеспечивает смещение от верха страницы (когда полоса прокрутки полностью вверх, это 0)
3. $. height () ... обеспечивает высоту видимой области в браузере пользователя / viewport
4. body.offsetHeight ... высота всей страницы

Как я могу добиться этого и какое событие лучше всего подходит для этого (в настоящее время оно находится при наведении курсора мыши)? Мои идеи:

1. используйте if / else, чтобы проверить, находится ли он в верхней или нижней части, прокрутите вверх, если e.pageY показывает, что он находится вверху, вниз, если e.page & находится внизу, а затем вызовите $ ('li'). mouseover () для перебора ...
   2. Используйте цикл do while ... на самом деле это сработало неплохо, но трудно остановить прокрутку слишком далеко. Но я не уверен, как управлять итерациями ....

Моя последняя попытка:

          ('li').mouseover(function(e) {

            totalHeight = document.body.offsetHeight;
            cursor.y = e.pageY;
            var papaWindow = window;
            var $pxFromTop = $(papaWindow).scrollTop();
            var $userScreenHeight = $(papaWindow).height();
            var iterate = 0;

            do {
                papaWindow.scrollBy(0, 2);
                iterate++;
                console.log(cursor.y, $pxFromTop, $userScreenHeight);
            }

            while (iterate < 20);
      });