Question

我有div元素，我有一个（ol）元素列表。我使用jquery nestable进行拖放。请在此处查看问题（How to scroll the window automatically when mouse moves bottom of the page using jquery）。

我曾经使用view-port（plugin - http://www.appelsiini.net/projects/viewport）在当前视图中获取可见的<li>。

我使用了下面的脚本。我无法更有效地滚动页面脚本在FF中不起作用（滚动不起作用）。

if ($('.dd-dragel').length > 0) {
  var totalVisibleLi = $('#ol_id li:visible').length;
  var liInViewPort = $('#ol_id li:in-viewport').length;
  var closestLi = $(this.placeEl).prev('li');
  var items = $('#ol_id li:in-viewport');
  var indexOfClosestLi = items.index(closestLi);

  if (indexOfClosestLi >= (liInViewPort - 3) && (e.pageY < $('#div_id').height())) {

    $('body').animate({
      scrollTop: $(window).scrollTop() + 200
    }, 1);
  }

  if (indexOfClosestLi <= 3) {
    $('body').animate({
      scrollTop: $(window).scrollTop() - 200
    }, 1);

  }
}

我在这里缺少什么？

Answer 1

编辑了您的代码。现在滚动也可用于FF

if ($('.dd-dragel').length > 0) {
  var totalVisibleLi = $('#ol_id li:visible').length;
  var liInViewPort = $('#ol_id li:in-viewport').length;
  var closestLi = $(this.placeEl).prev('li');
  var items = $('#ol_id li:in-viewport');
  var indexOfClosestLi = items.index(closestLi);

  if (indexOfClosestLi >= (liInViewPort - 3) && (e.pageY < $('#div_id').height())) {

    $('html,body').animate({
      scrollTop: $(window).scrollTop() + 200
    }, 400);
  }

  if (indexOfClosestLi <= 3) {
    $('html,body').animate({
      scrollTop: $(window).scrollTop() - 200
    }, 400);

  }
}

如何有效地制作滚动脚本？

1 个答案: