JS——offset
1、offsetWidth、offsetHeight返回盒子宽度和高度,包括padding与border,不包括margin
2、offsetLeft、offsetTop返回盒子距离定位盒子的x轴方向和y轴方向距离,如果没有定位盒子,则返回相对于body的距离
3、offsetParent返回距离定位盒子标签元素,如果没有定位盒子,则返回body标签元素
4、offsetLeft与style.left区别:
(1)父盒子中无定位,offsetLeft可以返回距离body的距离,同样情况,style.left返回“”;
(2)offsetLeft返回的数值,style.left返回的是数值+“px”;
(3)offsetLeft不可赋值,style.left即可赋值也可获取值
(4)style.left本身只可获取行内中的值,内联和外联是无法获取的
5、特别注意:
1、offsetWidth、offsetHeight取值时,只要div的宽和高带有小数点就会进一位
2、offsetLeft、offsetTop取值时,只要小数点逢到4就会进一位
JS——offset的更多相关文章
- js offset系列属性
offsetParent:返回该元素有定位的父级,如果父级都没有定位则返回body offsetTop:返回元素相对父级(带有定位的父级)上方的偏移 offsetLeft:返回元素相对父级(带有定位的 ...
- js offset
1.offsetParent offsetParent属性返回一个对象的引用,这个对象是距离调用offsetParent的元素最近的(在包含层次中最靠近的),并且是已进行过CSS定位的容器元素. 如果 ...
- 【前端】之JavaScript基础知识
JS 基础知识 JS中,简单类型的数据存储在栈中,复杂类型的数据存储在堆中,其引用存储在栈中 JS中的深拷贝和浅拷贝: 浅拷贝:将对象中的所有简单类型的属性拷贝出来,引用类型属性直接赋值null 深拷 ...
- jquery的offset().top 和position().top 详解 和如何用js实现
1 jquery定义: offset().top 相对于当前文档的坐标(的高度) ps:包括滚动条卷去的高度 position().top 返回的是相对于其定位的祖辈元素的坐标(的高度) ps:包括滚 ...
- (转)详解JS位置、宽高属性之一:offset系列
很多初学者对于JavaScript中的offset.scroll.client一直弄不明白,虽然网上到处都可以看一张图(图1),但这张图太多太杂,并且由于浏览器差异性,图示也不完全正确. 图一 不知道 ...
- JQ的offset().top与js的offsetTop区别详解
一.前言 最近在做一个图片懒加载的插件,就纵轴(Y轴)而言,我需要时时获取图片的上偏移量,好判断是否已进入视图区域,而我所理解的是offsetTop应该是跟offset().top一样的,然后陷入了因 ...
- python 全栈开发,Day52(关于DOM操作的相关案例,JS中的面向对象,定时器,BOM,client、offset、scroll系列)
昨日作业讲解: 京东购物车 京东购物车效果: 实现原理: 用2个盒子,就可以完整效果. 先让上面的小盒子向下移动1px,此时就出现了压盖效果.小盒子设置z-index压盖大盒子,将小盒子的下边框去掉, ...
- JS学习 - offset家族(一)
JS学习 - offset家族(一) 先来张图开开胃 offsetWidth offetHeight 得到对象的宽度和高度(自己的,与他人无关) offsetWidth = width + borde ...
- JS中client/offset/scroll等的宽高解析
原文地址:→传送门 window相关宽高属性 1. window.outerHeight (窗口的外层的高度) / window.outerWidth (窗口的外层的宽度) window.outerH ...
随机推荐
- Eureka集群的那些坑
今天遇到一个Eureka集群的一个坑. 问题现场类似是这样的:两台Eureka组成的服务注册中心集群,两台服务提供方server1.server2,两个服务调用方client1.client2. 正常 ...
- tomcat上传图片失败
今天,突然遇到个奇怪的问题,tomcat上传图片时好时坏,经查线上四台服务有一台服务器硬盘满了. 解决一下硬盘空间的问题,有好使了,那么图片上传通过流写到远程对象存储服务中,并没有落盘和硬盘满有哪些关 ...
- AI小记-K近邻算法
K近邻算法和其他机器学习模型比,有个特点:即非参数化的局部模型. 其他机器学习模型一般都是基于训练数据,得出一般性知识,这些知识的表现是一个全局性模型的结构和参数.模型你和好了后,不再依赖训练数据,直 ...
- java实现WebService 以及客户端不同的调用方式
java 实现WebService 以及不同的调用方式 webservice: 就是应用程序之间跨语言的调用 wwww.webxml.com.cn 1.xml 2. ws ...
- java ee标准DataSource理解
- HDU 1159 Common Subsequence (动规+最长公共子序列)
Common Subsequence Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Other ...
- mysql安装后改动port号password默认字符编码
1.改动password grant all privileges on *.* to 'root'@'localhost' identified by 'new password'; 2.改动por ...
- 布局技巧4:使用ViewStub
多亏了<include />标签,在Android里,很容易就能做到共享和重用UI组件.在Android开发中,很容易就能创建出复杂的UI结构,结果呢,用了很多的View,且其中的一些很少 ...
- 【总结】设备树对platform平台设备驱动带来的变化(史上最强分析)【转】
本文转载自:http://blog.csdn.net/fengyuwuzu0519/article/details/74375086 版权声明:本文为博主原创文章,转载请注明http://blog.c ...
- 机器视觉: LBP-TOP
之前介绍过机器视觉中常用到的一种特征:LBP http://blog.csdn.net/matrix_space/article/details/50481641 LBP可以有效地处理光照变化,在纹理 ...