jquery - 使用 slimscroll 插件滚动顶部

Question

我slimScroll在我的网页上使用的内容是通过 AJAX 添加的。

如果我向下滚动滚动然后重新加载更多内容（AJAX 加载），滚动条本身始终保持与以前相同的位置。

我想知道slimScroll加载新内容后是否有任何可以调用以滚动到顶部的功能？

Answer 1

我认为scroll@rochal 描述的选项现在不会起作用，因为它似乎没有被GitHub 上的当前版本使用。而是尝试scrollTo或scrollBy。

滚动到顶部：

$('#elem_id').slimScroll({ scrollTo : '0px' });

相反，如果你想滚动到底部，那么以下应该可以工作：

var scrollTo_val = $('#elem_id').prop('scrollHeight') + 'px';
$('#elem_id').slimScroll({ scrollTo : scrollTo_val });

Answer 2

从 1.0.0 版本开始，如果您需要滚动到顶部，您可以使用内置scrollTo方法：

$(element).slimScroll({ scrollTo: '0' });

Answer 3

这段代码已经为我运行了。

var scrollTo_int = $('#elem_id').prop('scrollHeight') + 'px';
$('#elem_id').slimScroll({scrollTo : scrollTo_int });

这将在底部位置获取滚动条，并在 div 的底部获取内容。

Answer 4

或者你可以使用javascript来解决这个问题......

document.getElementById("element-id").scrollTop = document.getElementById("element-id").scrollHeight;

element-id是id您的内容区域的（通常是它的div）..

当新内容附加到您的div

Answer 5

对我来说，作者@rochal 建议的答案不起作用，scrollTo也不scroll是 slimScroll 配置参数：两者都滚动内容但不滚动句柄，其中一个甚至破坏了我的情况下的容器高度。

相反，这对我有用：

// let's assume the plugin was initialized with this class name present:
$('.slim-scroll').slimScroll(config);

// then this is the solution.
$('.slimScrollDiv.inQuestion').find('.slimScrollBar').css({ top: 0 }).end().find('.slim-scroll').get(0).scrollTop = 0;

// -----------------------------
// once more, with explanations:
$('.slimScrollDiv.inQuestion')        // this is the ‹div› wrapped around our .slim-scroll element by the plugin. It always has the 'slimScrollDiv' class name.

  .find('.slimScrollBar')             // first address the handle. The order is important because we're going to break the chain at the end.
    .css({ top: 0 })                  // 'scroll' it.
  .end()                              // stay in the jQuery chain; go back to the last jQuery collection before find().

  .find('.slim-scroll')               // address the content.
    .get(0)                           // leave jQuery terrain, get the DOM element.
      .scrollTop = 0                  // scroll it.
;