Html 中scroll offset client 总结
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 总结的更多相关文章
- JavaScript中的 offset, client,scroll
在js 中我们要用到的 offset, client, scroll 在这我把自己理解的给大家分享一下. offset div.offsetTop 指div距离上方或上层控件的距离,单位像素 div. ...
- bom中的offset,client,scroll
简单明了
- scroll offset & client总结
oEvent.clientX 是指鼠标到可视区左边框的距离. oEvent.clientY 是指鼠标到可视区上边框的距离. clientWidth 是指可视区的宽度. clientHeight 是 ...
- javascript中常用坐标属性offset、scroll、client
原文:javascript中常用坐标属性offset.scroll.client 今天在学习js的时候觉得这个问题比较容易搞混,所以自己画了一个简单的图,并且用js控制台里面输出测试了下,便于理解. ...
- JS 中的offset、scroll、client总结
经常碰到offset.scroll.client这几个关键字,每次都要各种实验,这里总结一下. 两张图镇楼,随时翻阅 1. offset offset 指偏移,包括这个元素在文档中占用的所有显示宽度, ...
- 关于scroll、client、offset和style中的height、width、top以及bottom属性
内容和图片来自offset.scroll.client三大家族, 此处仅作记录使用 client offset scroll
- offset/client/scroll一些总结
offset/client/scroll一些总结 1.offset 首先offset共有五个值 1.offsetParent 2.offsetTop 3.offsetLeft 4.offsetWidt ...
- 三大家族(offset、scroll、client)
offset.scroll.client三大家族 offset家族 offsetWidth 与 offsetHeight offset 偏移 用于获取元素自身的位置和大小 offsetWidth和of ...
- client/scroll/offset width/height/top/left ---记第一篇博客
client/scroll/offset width/height/top/left (盒模型为contentBox,定位原点是元素左上角边框最外层的交点) clientWidth width+左p ...
随机推荐
- 【Maven】为什么Maven dependencies有的jar包显示为灰色?
因为它们的scope被限制住了,放开就恢复为亮白色. 来两张图片比对一下就清楚了: 没有限制scope,是正常的亮白色. 限制scope为test,显示为灰黑色. 其实颜色不重要,重要的是scope会 ...
- https://en.wikipedia.org/wiki/Green_threads
https://en.wikipedia.org/wiki/Green_threads
- mysql查看被锁住的表
转: mysql查看被锁住的表 2019年05月14日 11:58:59 hlvy 阅读数 1068更多 分类专栏: mysql mysql 转:https://blog.51cto.com/mo ...
- QML发布程序
如果是在windows系统下,则最终打包成exe windeployqt xxx.exe -qmldir C:\Qt\Qt5.9.6\5.9.6\mingw53_32\qml 注意使用Qt自己的 ...
- Mysql视图介绍
视图是一个存在于数据库中的虚拟表.视图本身没有数据,只是通过执行相应的select语句完成获得相应的数据.可以理解为select语句的别名. (1).视图的作用 1.如果某个查询结果出现的非常频繁,即 ...
- pcntl_waitpid函数解释
pcntl_waitpid 等待或返回fork的子进程状态.多进程的主进程创建了子进程,那主进程如何确认子进程的状态呢. 假如主进程需要根据子进程的状态做不同的处理呢, 这里的状态包括子进程被kill ...
- 【Leetcode_easy】653. Two Sum IV - Input is a BST
problem 653. Two Sum IV - Input is a BST 参考 1. Leetcode_easy_653. Two Sum IV - Input is a BST; 完
- [c++]struct timeval
struct timeval { time_t tv_sec; // seconds long tv_usec; // microseconds }; re 1. struct timespec 和 ...
- 《Fluid Engine Development》 学习笔记1-求解线性方程组
我个人对基于物理的动画很感兴趣,最近在尝试阅读<Fluid Engine Development>,由于内容涉及太多的数学问题,而单纯学习数学又过于枯燥,难以坚持学习(我中途放弃好多次了) ...
- rebbitMQwindows安装及使用
python中RabbitMQ的使用(安装和简单教程) 1,简介 RabbitMQ(Rabbit Message Queue)是流行的开源消息队列系统,用erlang语言开发. 1.1关键词说明: ...