我试图用JavaScript检测浏览器滚动条的位置,以确定当前视图在页面中的位置。
我的猜测是,我必须检测拇指在轨道上的位置,然后是拇指的高度占轨道总高度的百分比。是我过于复杂了,还是JavaScript提供了一个更简单的解决方案?代码会是什么样子?
我试图用JavaScript检测浏览器滚动条的位置,以确定当前视图在页面中的位置。
我的猜测是,我必须检测拇指在轨道上的位置,然后是拇指的高度占轨道总高度的百分比。是我过于复杂了,还是JavaScript提供了一个更简单的解决方案?代码会是什么样子?
当前回答
这是另一种获取滚动位置的方法:
const getScrollPosition = (el = window) => ({
x: el.pageXOffset !== undefined ? el.pageXOffset : el.scrollLeft,
y: el.pageYOffset !== undefined ? el.pageYOffset : el.scrollTop
});
其他回答
这是另一种获取滚动位置的方法:
const getScrollPosition = (el = window) => ({
x: el.pageXOffset !== undefined ? el.pageXOffset : el.scrollLeft,
y: el.pageYOffset !== undefined ? el.pageYOffset : el.scrollTop
});
是这样的:)
window.addEventListener("scroll", (event) => {
let scroll = this.scrollY;
console.log(scroll)
});
我认为下面的函数可以帮助获得滚动坐标值:
const getScrollCoordinate = (el = window) => ({
x: el.pageXOffset || el.scrollLeft,
y: el.pageYOffset || el.scrollTop,
});
我从这个答案中得到了这个想法,只是做了一点改变。
如果你关心整个页面,你可以使用这个:
document.body.getBoundingClientRect().top
你可以使用element。scrollTop和元素。scrollLeft分别获取已滚动的垂直和水平偏移量。元素可以是文档。如果你关心整页的话。你可以将它与element进行比较。offsetHeight和element。如果需要百分比,则offsetWidth(同样,element可能是body)。