页面滚动回到顶部

页面浏览到某处，点击返回顶部

// 页面滚动回到顶部 const scrollTop = () => {
// 该函数用于获取当前网页滚动条垂直方向的滚动距离 
const range = document.documentElement.scrollTop || document.body.scrollTop 
// 如果大于0 if (range > 0) { 
    // 该函数用于实现页面的平滑滚动效果 
    window.requestAnimationFrame(scrollTop) 
    window.scrollTo(0, range - range / 8) 
    } 
}

获取页面滚动距离

获取页面滚动距离，根据滚动需求处理业务

// 该函数用于获取当前页面滚动的位置，可选参数target默认为window对象 
const getPageScrollPosition = (target = window) => ({ 
// 函数返回一个包含x和y属性的对象，分别表示页面在水平和垂直方向上的滚动位置。函数内部通过判断target对象是否具有pageXOffset和pageYOffset属性来确定滚动位置的获取方式，如果存在则使用该属性值，否则使用scrollLeft和scrollTop属性。 
    x: target.pageXOffset !== undefined ? target.pageXOffset : target.scrollLeft, 
    y: target.pageYOffset !== undefined ? target.pageYOffset : target.scrollTop, }) 
    getPageScrollPosition()
})

  

作者：JavaDog程序狗
链接：juejin.cn/post/737653…
来源：稀土掘金
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。