前端

(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()

js 获取窗口/容器内部滚动位置的更多相关文章

  1. js获取编辑框游标的位置

    代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w ...

  2. js点击获取—通过JS获取图片的相对坐标位置

    一.通过JS获取鼠标点击时图片的相对坐标位置 源代码如下所示: <!DOCTYPE html> <html lang="en"> <head> ...

  3. Javascript 获取窗口的大小和位置

    在Javascript中可以使用OuterWidth,OuterHeight 获取浏览器的大小.用 innerWidth,innerHeight 来获取窗口的大小(除去浏览器边框部分).对于IE6 及 ...

  4. js获取输入框中当前光标位置并在此位置插入字符串的方法(angularjs+ts)

    一半是参照别人代码,一半是自己代码,略笨拙,如果有更好的方法希望分享. 获取当前光标位置的方法 getCaretPosition (obj:any) { //获取输入框中当前光标的位置,obj为此输入 ...

  5. js获取窗口滚动条高度、窗口可视范围高度、文档实际内容高度、滚动条离浏览器底部的高度

    1.获取窗口可视范围的高度 //获取窗口可视范围的高度 function getClientHeight(){ var clientHeight=0; if(document.body.clientH ...

  6. js获取窗口参数

    window.onscroll=function getScrollTop(){ console.log(scrollTop) if(document.documentElement&& ...

  7. [原]js获取dom元素的实际位置及相对坐标

    关键API: Element.getBoundingClientRect() mdn:https://developer.mozilla.org/en-US/docs/Web/API/Element/ ...

  8. JS获取和设置光标的位置

    <html> <head> <script language="javascript"> function getCursortPosition ...

  9. js获取元素宽高、位置相关知识汇总

    常见clientWidth.clientHeight.offsetWidth.offsetLeft,clientX.scrollTop等词语,比较混乱,现在总结下他们的区别. 1. clientWid ...

随机推荐

  1. 2020/10/3笔记-网络概述、拓扑类型、OSI模型

    网络(network) 1.什么是网络 计算机网络(简称为网络)由若干节点(node)和连接的链路组成.网络中的节点可以是计算机.集线器.交换机或路由器等. 2.网络的作用是什么 网络最终为了解决的问 ...

  2. Python之常用数据类型详解

    tuple 元组 1 # 定义 2 temp = (2, ) # 规范定义,单个元素的元组 3 tem = 2, # 可行,但不规范定义 4 tep = () # 空元组 5 6 tp = (1, ' ...

  3. 【javascript】chormeV8源码阅读之 GC(垃圾回收)过程 笔记

    1.为何需要垃圾回收     在V8引擎逐行执行JavaScript代码的过程中,当遇到函数的情况时,会为其创建一个函数执行上下文(Context)环境并添加到调用堆栈的栈顶,函数的作用域(handl ...

  4. iview 中Modal组件点击确定后验证信息不通过则不关闭弹窗方法

    <Modal v-model="isTemManageShow" title="管理模板" @on-ok="ok" :loading= ...

  5. PointGNN未修改之前的结果 ---行人,骑行者

    dl 18 23

  6. archlinux 源配置 桌面美化 终端美化 常用软件 grub配置

    简介 本文讲对archlinux进行一些基础系统的配置.常用安装的安装,美化进行配置,先看一下美化后的效果吧 配置pacman和使用AUR(archlinuxcn源) archlinux采用滚动更新的 ...

  7. Python学习笔记--布尔类型和比较运算符、if判断语句以及相关案例的实现

    布尔类型和比较运算符 代码: 结果: 主要有以下几类: 注意:bool类型的真假表示开头必须大写,例如:True和False 而要是想要得到布尔类型,除了直接定义,还可以通过比较运算得到布尔类型: i ...

  8. 【读书笔记】排列研究-置换角度(分解为Products Of Cycles) 含GroupExploer使用

    upd 2020-08-06 23:11完成了最初稿 目录 定义 开胃菜 entrée 群论角度 应用:几何变换 当然要从第一类斯特林数的角度来考虑一下 一个排列的type定义 排旗公式 应用-共轭排 ...

  9. springboot--多环境启动

    法一: 法二:

  10. CSS 高阶小技巧 - 角向渐变的妙用!

    本文将介绍一个角向渐变的一个非常有意思的小技巧! 我们尝试使用 CSS 绘制如下图形: 在之前,类似的图案,其实我们有尝试过,在 单标签实现复杂的棋盘布局 一文中,我们用单标签实现了这样一个棋盘布局: ...