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 />
距离顶部位置:
js 获取窗口/容器内部滚动位置的更多相关文章
- js获取编辑框游标的位置
代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w ...
- js点击获取—通过JS获取图片的相对坐标位置
一.通过JS获取鼠标点击时图片的相对坐标位置 源代码如下所示: <!DOCTYPE html> <html lang="en"> <head> ...
- Javascript 获取窗口的大小和位置
在Javascript中可以使用OuterWidth,OuterHeight 获取浏览器的大小.用 innerWidth,innerHeight 来获取窗口的大小(除去浏览器边框部分).对于IE6 及 ...
- js获取输入框中当前光标位置并在此位置插入字符串的方法(angularjs+ts)
一半是参照别人代码,一半是自己代码,略笨拙,如果有更好的方法希望分享. 获取当前光标位置的方法 getCaretPosition (obj:any) { //获取输入框中当前光标的位置,obj为此输入 ...
- js获取窗口滚动条高度、窗口可视范围高度、文档实际内容高度、滚动条离浏览器底部的高度
1.获取窗口可视范围的高度 //获取窗口可视范围的高度 function getClientHeight(){ var clientHeight=0; if(document.body.clientH ...
- js获取窗口参数
window.onscroll=function getScrollTop(){ console.log(scrollTop) if(document.documentElement&& ...
- [原]js获取dom元素的实际位置及相对坐标
关键API: Element.getBoundingClientRect() mdn:https://developer.mozilla.org/en-US/docs/Web/API/Element/ ...
- JS获取和设置光标的位置
<html> <head> <script language="javascript"> function getCursortPosition ...
- js获取元素宽高、位置相关知识汇总
常见clientWidth.clientHeight.offsetWidth.offsetLeft,clientX.scrollTop等词语,比较混乱,现在总结下他们的区别. 1. clientWid ...
随机推荐
- 磊磊零基础打卡算法:day20 c++dfs树的深度优先遍历
5.24 dfs深度优先搜索: 思想比较简单,就是一条路走到底,走到最深点处再回退一步,再看有没有路可以走,没有的话再回退一步,重复此步骤: 也是人们常讲的暴搜. 主要的用法: 通常需要一个状态数组来 ...
- uni-app微信小程序解决多个视频同时播放问题
这里我用的uni-app开发的小程序,微信小程序原生开发也是同理, 写法和api简单改下就行 当你的页面上有多个视频video组件标签时, 会出现多个视频可以同时播放的问题,这样显然是不正常的, 那么 ...
- vs2019 配置 qt6
1.下载qt6 我的目录C:\Qt\6.3.1\msvc2019_64\bin C:\Qt\6.3.1\msvc2019_64\include C:\Qt\6.3.1\msvc2019_64\lib ...
- 2021SWPUCTF-WEB(二)
ez_unserialize 不知道在哪,御剑扫叭 有一个robots.txt 一道反序列化好像是 分析代码应该是admin=admin.passwd=ctf即可输出flag < ...
- 解决Python写入yaml后排版混乱还丢失注释问题
转载https://www.cnblogs.com/jiahm/category/1530828.html 大家有没有遇到过在使用Python进行yaml文件写入数据后,内容排版混乱并且丢失注释问题, ...
- 201971010110-高杨 实验三 结对项目—《{0-1}KP 实例数据集算法实验平台》项目报告
项目内容 项目 内容 班级博客链接 https://edu.cnblogs.com/campus/xbsf/2019nwnucs 作业要求 https://edu.cnblogs.com/campus ...
- Windows系统镜像下载站合集
Windows系统镜像下载站合集https://latest10.win/https://msdn.itellyou.cn/https://hellowindows.cn/https://www.im ...
- mysql索引类型详解
转载网址: http://c.biancheng.net/view/7897.html
- 关于如何在IDEA里面配置好Git和Github的相关步骤详解
配置Git 1.File->settings 然后选择其中的Version Control: 接着选择其中的Git选项: 2.将文本框内容定位到本地下载git路径下面 然后点击右边的Test测试 ...
- SpringBoot——自定义start
更多内容,前往 IT-BLOG 一.Mybatis 实现 start 的原理 首先在写一个自定义的 start 之前,我们先参考下 Mybatis 是如何整合 SpringBoot:mybatis-s ...