滚动至页面底部附近

Scroll to near the bottom of page

本文关键字：底部 滚动      更新时间：2023-09-26

如何在页面底部附近滚动。我使用以下代码滚动到非常底部：

$(document).scrollTop($(document).height());

如何更改此代码以滚动底部附近的？

距离多远？

$(document).scrollTop($(document).height() - 1000);

将滚动到底部。这里的问题是，您还必须考虑视口的高度。

一个很好的跨浏览器获取视口高度的方法是：

var height = Math.max(document.documentElement.clientHeight, window.innerHeight || 0)

然后：

var offset = 100;//your offset. 100px from the bottom here
$(document).scrollTop($(document).height() - (height + offset);

尝试

$(document).scrollTop(($(document).height() - [the offset you want]));

您的代码是正确的，但文档高度必须大于窗口高度才能工作。

$(document).ready(function(){
    $("button").click(function(){
      var offset = 500;
      var scrollX = $(document).height() - offset;
      alert(scrollX);
      $(document).scrollTop(scrollX);
    });
});
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
</head>
<body style="height:1500px">
<p>lorem Ipsum lorem Ipsum lorem Ipsum lorem Ipsum lorem Ipsum lorem Ipsum lorem Ipsum lorem Ipsum lorem Ipsum lorem Ipsum lorem Ipsum lorem Ipsum lorem Ipsum lorem Ipsum </p>
<button>Scroll to bottom</button>
</body>
</html>

相关文章：