我在网页上使用slimScroll
,内容由AJAX添加。
如果我向下滚动滚动然后重新加载更多内容(AJAX加载),滚动条本身始终保持其位置与以前相同。
我想知道slimScroll
是否有任何我可以在加载新内容后调用滚动到顶部的功能?
答案 0 :(得分:22)
我不认为@rochal描述的scroll
选项现在可以正常工作,因为the version currently up on GitHub似乎没有使用它。而是尝试scrollTo
或scrollBy
。
滚动到顶部:
$('#elem_id').slimScroll({ scrollTo : '0px' });
相反,如果您想滚动到底部,那么以下内容应该有效:
var scrollTo_val = $('#elem_id').prop('scrollHeight') + 'px';
$('#elem_id').slimScroll({ scrollTo : scrollTo_val });
答案 1 :(得分:5)
从版本1.0.0开始,如果您需要滚动到顶部,可以使用 scrollTo 方法构建:
$(element).slimScroll({ scrollTo: '0' });
答案 2 :(得分:2)
此代码已经运行了。
var scrollTo_int = $('#elem_id').prop('scrollHeight') + 'px';
$('#elem_id').slimScroll({scrollTo : scrollTo_int });
这将在底部位置使用滚动条,并且还会获取div底部的内容。
答案 3 :(得分:0)
或者您可以使用javascript来解决这个问题...
document.getElementById("element-id").scrollTop = document.getElementById("element-id").scrollHeight;
element-id
是您内容区域的id
(通常为div
)..
在新内容附加到div
答案 4 :(得分:0)
对我来说,作者@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.
;