HTML精确定位:scrollLeft,scrollWidth,clientWidth,offsetWidth


scrollHeight: 获取对象的滚动高度。
scrollLeft:设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离
scrollTop:设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离
scrollWidth:获取对象的滚动宽度
offsetHeight:获取对象相对于版面或由父坐标 offsetParent 属性指定的父坐标的高度
offsetLeft:获取对象相对于版面或由 offsetParent 属性指定的父坐标的计算左侧位置
offsetTop:获取对象相对于版面或由 offsetTop 属性指定的父坐标的计算顶端位置
event.clientX 相对文档的水平座标
event.clientY 相对文档的垂直座标
event.offsetX 相对容器的水平坐标
event.offsetY 相对容器的垂直坐标
document.documentElement.scrollTop 垂直方向滚动的值
event.clientX+document.documentElement.scrollTop 相对文档的水平座标+垂直方向滚动的量

这里是JavaScript中建造迁移转变代码的常用属性


页可见区域宽: document.body.clientWidth;
网页可见区域高: document.body.clientHeight;
网页可见区域宽: document.body.offsetWidth (包含边线的宽);
网页可见区域高: document.body.offsetHeight (包含边线的宽);
网页正文全文宽: document.body.scrollWidth;
网页正文全文高: document.body.scrollHeight;
网页被卷去的高: document.body.scrollTop;
网页被卷去的左: document.body.scrollLeft;
网页正文项目组上: window.screenTop;
网页正文项目组左: window.screenLeft;
屏幕辨别率的高: window.screen.height;
屏幕辨别率的宽: window.screen.width;
屏幕可用工作区高度: window.screen.availHeight;

Html 中scroll offset client 总结的更多相关文章

  1. JavaScript中的 offset, client,scroll

    在js 中我们要用到的 offset, client, scroll 在这我把自己理解的给大家分享一下. offset div.offsetTop 指div距离上方或上层控件的距离,单位像素 div. ...

  2. bom中的offset,client,scroll

    简单明了

  3. scroll offset & client总结

    oEvent.clientX 是指鼠标到可视区左边框的距离. oEvent.clientY 是指鼠标到可视区上边框的距离. clientWidth  是指可视区的宽度. clientHeight  是 ...

  4. javascript中常用坐标属性offset、scroll、client

    原文:javascript中常用坐标属性offset.scroll.client 今天在学习js的时候觉得这个问题比较容易搞混,所以自己画了一个简单的图,并且用js控制台里面输出测试了下,便于理解. ...

  5. JS 中的offset、scroll、client总结

    经常碰到offset.scroll.client这几个关键字,每次都要各种实验,这里总结一下. 两张图镇楼,随时翻阅 1. offset offset 指偏移,包括这个元素在文档中占用的所有显示宽度, ...

  6. 关于scroll、client、offset和style中的height、width、top以及bottom属性

    内容和图片来自offset.scroll.client三大家族, 此处仅作记录使用 client offset scroll

  7. offset/client/scroll一些总结

    offset/client/scroll一些总结 1.offset 首先offset共有五个值 1.offsetParent 2.offsetTop 3.offsetLeft 4.offsetWidt ...

  8. 三大家族(offset、scroll、client)

    offset.scroll.client三大家族 offset家族 offsetWidth 与 offsetHeight offset 偏移 用于获取元素自身的位置和大小 offsetWidth和of ...

  9. client/scroll/offset width/height/top/left ---记第一篇博客

    client/scroll/offset width/height/top/left (盒模型为contentBox,定位原点是元素左上角边框最外层的交点) clientWidth  width+左p ...

随机推荐

  1. 对请求数据的格式化 方案 Spring Cloud Gateway features:

    对请求数据的格式化 例如 {body:{}}--->{data:{}} 执行阶段概念 · OpenResty最佳实践 · 看云 https://www.kancloud.cn/kancloud/ ...

  2. Nginx可以说是标配组件,但是主要场景还是负载均衡、反向代理、代理缓存、限流等场景;而把Nginx作为一个Web容器使用的还不是那么广泛。

    Nginx可以说是标配组件,但是主要场景还是负载均衡.反向代理.代理缓存.限流等场景:而把Nginx作为一个Web容器使用的还不是那么广泛. 用Nginx+Lua(OpenResty)开发高性能Web ...

  3. python @classmethod

    写在前面 写博客的时候,我发现拖延症很严重,本来昨天要开始写的,结果东看看,西翻翻,啥也没落实下来.时间过去了,口袋里的收获却寥寥无几.讨厌这样的自己.我要戒掉这个不好的毛病. 拖延症的底层原因之一是 ...

  4. 如何交叉编译curl?

    1. 先准备一下openssl库 编译openssl库的方法在此 2. 获取curl源码 wget https://curl.haxx.se/download/curl-7.65.3.tar.gz 2 ...

  5. 解决kali无法连接网络问题

    键入 ifconfig -a 查看网卡 ,是否存在 键入 leafpad /etc/network/interfaces 查看其中是否有如下语句,没有添加上即可:auto eth0iface eth0 ...

  6. com.alibaba.fastjson.JSONObject;的使用

    转: com.alibaba.fastjson.JSONObject;的使用 2018-11-04 23:51:23 mameng1998 阅读数 6404更多 分类专栏: java   1  POM ...

  7. spark简单文件配置

    cd /usr/local/spark/spark-2.2.1-bin-hadoop2.7/conf cp slaves.template slaves cp spark-env.sh.templat ...

  8. git帮助和小结

    获取帮助 想了解 Git 的各式工具该怎么用,可以阅读它们的使用帮助,方法有三: $ git help <verb> $ git <verb> --help $ man git ...

  9. spark实现wordcount

    spark-shell --master yarnsc:val lineRDD=sc.textFile("/test/input/test")lineRDD.collect().f ...

  10. Java不写文件,LOAD DATA LOCAL INFILE大批量导入数据到MySQL的实现(转)

    MySQL使用load data local infile 从文件中导入数据比insert语句要快,MySQL文档上说要快20倍左右.但是这个方法有个缺点,就是导入数据之前,必须要有文件,也就是说从文 ...