js 获取窗口/容器内部滚动位置

前端

(document.getElementsByClassName("container")[0]).scrollTop -- 容器内部滚动条位置

(document.getElementsByClassName("container")[0]).scrollHeight -- 容器内部滚动区域高度

(document.getElementsByClassName("container")[0]).offsetHeight-- 容器自身在上层容器的滚动位置

(document.getElementsByClassName("containerItem")[0]).getBoundingClientRect() -- 元素距离窗口上方的相对位置。

容器内部滚动条是否滚动到底部:

var container=document.getElementsByClassName("leftCommentRecord")[0];

container.scrollTop+container.offsetHeight==container.scrollHeight

注:offsetHeight与clientHeight看具体情况使用,窗口内滚动使用offsetHeight,容器内部滚动使用clientHeight。

 

小程序 

 1       <ScrollView
 2         className={classnames(
 3           'evaluateParent',
 4         )}
 5         scrollY
 6         enableBackToTop
 7         scrollAnchoring
 8         onScroll={(event) => this.onPageScrollChanged(event.detail)}
 9         style={{ height: wx.getSystemInfoSync().windowHeight }}
10       />

距离顶部位置:

    wx.createSelectorQuery().select('#messageTypeTabs').boundingClientRect(rect => {
      console.log(rect)
    }).exec()
posted @ 2020-10-27 11:24  唐宋元明清2188  阅读(1314)  评论(0编辑  收藏  举报