setOff与scrollTop区别
1.offsetTop :
当前对象到其上级层顶部的距离.
不能对其进行赋值.设置对象到页面顶部的距离请用style.top属性.
2.offsetLeft :
当前对象到其上级层左边的距离.
不能对其进行赋值.设置对象到页面左部的距离请用style.left属性.
3.offsetWidth :
当前对象的宽度.
与style.width属性的区别在于:如对象的宽度设定值为百分比宽度,则无论页面变大还是变小,style.width都返回此百分比,而offsetWidth则返回在不同页面中对象的宽度值而不是百分比值
4.offsetHeight :
与style.height属性的区别在于:如对象的宽度设定值为百分比高度,则无论页面变大还是变小,style.height都返回此百分比,而offsetHeight则返回在不同页面中对象的高度值而不是百分比值
5.offsetParent :
当前对象的上级层对象.
注意.如果对象是包括在一个DIV中时,此DIV不会被当做是此对象的上级层,(即对象的上级层会跳过DIV对象)上级层是Table时则不会有问题.
利用这个属性,可以得到当前对象在不同大小的页面中的绝对位置.
6.scrollLeft :
对象的最左边到对象在当前窗口显示的范围内的左边的距离.
即是在出现了横向滚动条的情况下,滚动条拉动的距离.
7.scrollTop
对象的最顶部到对象在当前窗口显示的范围内的顶边的距离.
即是在出现了纵向滚动条的情况下,滚动条拉动的距离.
setOff与scrollTop区别的更多相关文章
- offsetTop,offsetHeight,clientHeight,scrollHeight,scrollTop区别
这些高度相信很多同学都搞不清楚吧.这里我通过本地测试,发现了区别. 以聊天窗口为例. 元素(class='content')高度444px,其中上下padding分别是10px,margin为0.距离 ...
- offsetheight 和clientheight、scrollheight、scrollTop区别
clientHeight:元素客户区的大小,指的是元素内容及其边框所占据的空间大小(经过实践取出来的大多是视口大小) scrollHeight: 滚动大小,指的是包含滚动内容的元素大小(元素内容的总高 ...
- jquery 对象的 height、innerHeight、outerHeight 的区别以及DOM 元素的 clientHeight、offsetHeight、scrollHeight、offsetTop、scrollTop
前言:jquery 对象的 height.innerHeight.outerHeight,还有 DOM 元素的 clientHeight.offsetHeight.scrollHeight.offse ...
- vue中检测敏感词,锚点
当发布文章的时候,标题有敏感词 则检测有敏感词的接口成功的时候,写锚点 eg: _this .$alert("检测到标题有敏感词,请修改后再发布", "提示", ...
- js中top、clientTop、scrollTop、offsetTop的区别 文字详细说明版【转】
之前在修改IE6下的一个显示bug时,查到过这些,贴这备忘,后面给出了详细说明,以前的版本,没仔细的说明,特希望大家也收藏下. 网页可见区域宽: document.body.clientWidth ...
- scrollTop和offsetTop的区别,scrollTopLeft和offsetLeft的区别
scrollTop和offsetTop的区别:scrollTop是指某个可滚动区块向下滚动的距离,比如向下滚动了10个像素,那么这个元素的scrollTop属性值就是10,这个属性的值是可读写的,且不 ...
- javascript中scrollTop和offsetTop的区别
scrollTop是指某个可滚动区块向下滚动的距离,offsetTop则是元素的上边框与父元素的上边框的绝对距离. 1.offsetTop : 当前对象到其上级层顶部的距离. 不能对其进行赋值.设 ...
- offsetHeight,scrollHeight,clientHeight,scrollTop以及pageX,clientX,offsetX,screenX,offsetLeft,style.left等的区别以及使用详解
一.写在前面 在阅读本文前,希望大家能针对每个属性亲手测试,网上现有的大量相关博客都有不等的概念错误,毕竟亲手实践才能更好的掌握这些概念. 1.pageX,clientX,screenX与offset ...
- js中top、clientTop、scrollTop、offsetTop的区别 文字详细说明版
网页可见区域宽: document.body.clientWidth;网页可见区域高: document.body.clientHeight;网页可见区域宽: document.body.offset ...
随机推荐
- 「疫期集训day10」玫瑰
不管我们在怎么抵抗,德国都已经败了----失守苏瓦松后绝望中的德国兵 (貌似今天的题记和内容毫无关系) 觉得以后还是不要抱怨考试失误了,感觉没啥大用 T1暴搜/状压(然俄一看题很像刚写过的二分答案,上 ...
- [POJ1852] Ants(思维题)
题干 An army of ants walk on a horizontal pole of length l cm, each with a constant speed of 1 cm/s. W ...
- hdu 4352 XHXJ's LIS 数位DP+最长上升子序列
题目描述 #define xhxj (Xin Hang senior sister(学姐))If you do not know xhxj, then carefully reading the en ...
- zsh切换bash提示chsh: no changes made问题
前提纪要:1.我们都知道mac有默认bash工具,在下载zsh后,把一切都配置好后,输入切换命令:chsh - s /bin/zsh ,总是提示 chsh: no changes made错误.那我我 ...
- 介绍python由来, 安装python3.8.3 及其变量的定义, 小整数池
介绍 python的创始人为吉多·范罗苏姆(Guido van Rossum).1989年的圣诞节期间,Guido开始写能够解释Python语言语法的解释器.Python这个名字,来自Guido所挚爱 ...
- Spring-boot 启动报错 调试小技巧
描述: 我们在启动spring-boot,spring-cloud 项目时,是不是经常 遇到报错,但是在控制台 没有能找到 具体 报错信息,只是 提示,启动失败,缺乏具体的报错信息,这样就很不方便我们 ...
- java 数据结构(十二):Collections工具类的使用
Collections工具类1.作用:操作Collection和Map的工具类 2.常用方法:reverse(List):反转 List 中元素的顺序shuffle(List):对 List 集合元素 ...
- 数据可视化之PowerQuery篇(十九)PowerBI数据分析实践第三弹 | 趋势分析法
https://zhuanlan.zhihu.com/p/133484654 本文为星球嘉宾"海艳"的PowerBI数据分析工作实践系列分享之三,她深入浅出的介绍了PowerBI ...
- VMWare WorkStation中MacOS虛擬機無法啓動的問題
關於MacOS虛擬機,在有VMWare重裝,升級以及MacOS更新時,都可能會造成破解補丁失效,因此儅Mac虛擬機無法啓動時,可以嘗試以下操作: 重新運行unlocker208中的win-instal ...
- git和github连接权限(这是一个简便方法,不是很安全,建议大家还是用ssh解决)
在使用,git从github上clone下来代码后. 我们再工作区进行编辑,然后提交. 最后我们想要将我们的改变推送到github上. 但是往往这个时候,我们可能会面临这样的问题. 我们没有权限将代码 ...