如何在 JavaScript 中获取滚动条位置？

使用 JavaScript 获取滚动条位置

要确定网页上的当前视图位置，您可以使用 JavaScript 确定滚动条位置。本指南将演示如何实现这一点。

要获取滚动条位置，您可以利用 element.scrollTop 和 element.scrollLeft 属性。这些属性分别返回已滚动的 element 元素的垂直和水平偏移量。如果您对整个页面感兴趣，可以将 element 设置为 document.body。

要确定百分比，您可以将偏移值与 element.offsetHeight 和 element.offsetWidth 进行比较。再次强调，element 可以是文档主体。

下面是演示这些属性用法的示例代码片段：

// Get the vertical scroll position of the document
const verticalScrollPos = document.body.scrollTop;

// Get the horizontal scroll position of the document
const horizontalScrollPos = document.body.scrollLeft;

// Get the height and width of the document
const documentHeight = document.body.offsetHeight;
const documentWidth = document.body.offsetWidth;

// Calculate the percentage of the vertical scroll position
const verticalScrollPercentage = (verticalScrollPos / documentHeight) * 100;

// Calculate the percentage of the horizontal scroll position
const horizontalScrollPercentage = (horizontalScrollPos / documentWidth) * 100;

以上是如何在 JavaScript 中获取滚动条位置？的详细内容。更多信息请关注PHP中文网其他相关文章！