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. c3p0数据库连接池 原创: Java之行 Java之行 5月8日 一、连接池概述 实际开发中“获得连接”或“释放资源”是非常消耗系统资源的两个过程

    c3p0数据库连接池 原创: Java之行 Java之行 5月8日 一.连接池概述 实际开发中“获得连接”或“释放资源”是非常消耗系统资源的两个过程 DB连接池HikariCP为什么如此快 原创: D ...

  2. [转][C#]Oracle 连接错误的解决

    错误1: .NET连接oracle,提示错误OCIEnvCreate 失败,返回代码为 -1,但错误消息文本不可用 两个原因: 1. 权限,把 Oracle 所在目录权限设置成 authenticat ...

  3. ubuntu更强大的包管理工具:aptitude

        aptitude 与 apt-get 一样,是 Debian 及其衍生系统ubuntu上 一个强大的包管理工具.与 apt-get 不同的是,aptitude 在处理依赖问题上更佳一些.apt ...

  4. Jmeter BeanShell 引用变量报错Error or number too big for integer

    如果你通过CSV Data Set Config或者_StringFromFile函数来参数化你的请求,需要特别注意当参数为纯数字时,jmeter会默认将其识别成int型数据,说明jmeter并不是默 ...

  5. 阶段5 3.微服务项目【学成在线】_day09 课程预览 Eureka Feign_08-课程预览技术方案

    3.2.1 技术需求 课程详情页面是向用户展示课程信息的窗口,课程相当于网站的商品,本页面的访问量会非常大.此页面的内容设 计不仅要展示出课程核心重要的内容而且用户访问页面的速度要有保证,有统计显示打 ...

  6. REUSE_ALV_POPUP_TO_SELECT使用技巧

    可以实现弹出一个对话框,提供选择数据的功能…… 栗子1: CALL FUNCTION 'REUSE_ALV_POPUP_TO_SELECT' TYPE-POOLS slis. DATA: selec ...

  7. Python3之类和实例

    面向对象的重要概念就是类(Class)和实例(Instance),必须牢记类是抽象的模板,比如学生类Student,而实例是根据类创建出来的一个个具体的对象,每个对象都拥有相同的方法,单各自的数据可能 ...

  8. Docker镜像仓库Harbor搭建

    园子里面已经有人写过了.也写得很好,我这里只记录下我遇到的问题 Harbor 依赖: 1:docker 2:docker-compose 怎么安装就不说了. 然后是安装Harbor github:ht ...

  9. 打开app应用

    =========================================人才网 <!--app底部浮动广告--><style> footer { padding-bo ...

  10. liunx -bash:ls:command not found,执行命令总是报找不到

    解决办法: 使用绝对命令vi打开profile /bin/vi  /etc/profile 添加: export PATH=/usr/local/sbin:/usr/local/bin:/sbin:/ ...