offset笔记

1、offsetParent

  2、offsetTop

  3、offsetLeft

  4、offsetWidth

  5、offsetHeight

offsetWidth是元素的可视宽度,这个宽度包括元素的边框(border),水平padding,垂直滚动条宽度,元素本身宽度等。

offsetHeight跟offsetWidth类似,只是方向改为垂直方向上的。

  

offsetLeft也就是返回对象元素边界的左上角顶点相对于offsetParent的左上角顶点的水平偏移量。它与当前元素的margin-left和offsetParent的padding-left有关。

offsetHeight同理。

offsetParent:最近的定位的父元素

1、如果当前元素的父级元素没有进行CSS定位(position为absolute或relative),offsetParent为body。

  2、如果当前元素的父级元素中有CSS定位(position为absolute或relative),offsetParent取最近的那个父级元素。

时间: 2024-08-25 12:58:21

offset笔记的相关文章

MySQL 学习笔记 (limit offset)

select * from table limit (10000,10);这样是很慢的,因为要定位 比较快的写法是 select * from table where id >=(select * from table limit (10000,1) ) limit 10;不要问题为什么! 因为目前也用不到.最直接的方法还是建议把数据弄小,不然就设计一些算法来计算第几应该有哪些资料,直接定位获取 . MySQL 学习笔记 (limit offset)

JavaScript学习笔记5 之 计时器 & scroll、offset、client系列属性 & 图片无缝滚动

一.计时器 setInterval ( 函数/名称 , 毫秒数 )表示每经过一定的毫秒后,执行一次相应的函数(重复) setTimeout ( 函数/名称 , 毫秒数 ) 表示经过一定的毫秒后,只执行一次相应的函数(不重复) 清除计时器: clearInterval( ); clearTimeout( ); 当计时器调用执行完毕时,它将返回一个timer ID, 如果将该ID传递给clearInterval,便可以终止代码的执行. 实例: 页面布局: <div id="wrap"

offset,client,style相关笔记

1.offsetTop 功能:获取元素上外缘与最近的定位父元素内壁的距离,如果没有定位父元素,则是与文档上内壁的距离 使用方法:js document.querySelector(...).offsetTop 返回数字类型 只读 注解:边缘:border以外 定位父元素:position为relative,absolute或fixed 内壁:border以内 1.1 style.top 功能:与offsetTop相同 使用方法:js document.querySelector(...).sty

前端攻城狮学习笔记九:让你彻底弄清offset

很多初学者对于JavaScript中的offset.scroll.client一直弄不明白,虽然网上到处都可以看一张图(图1),但这张图太多太杂,并且由于浏览器差异性,图示也不完全正确. 图一 不知道大家看到这张图的第一感觉如何,反正我的感觉就是“这次第,怎一个乱字了得”. 既然我认为上图太多太乱,那么我就把offset.scroll.client分开说,希望能让大家彻底弄清楚,今天只说offset. 一.关于offset,我们要弄明白什么 w3中offset相关页面是:http://www.w

VBA学习笔记之Range.Offset属性

'Range.Offset 属性'返回 Range 对象,它代表位于指定单元格区域的一定的偏移量位置上的区域.'表达式.Offset(偏移行, 偏移列)'表达式 一个代表 Range 对象的变量.'偏移行列的数字可以是:正数,负数,零值 1 Sub test() 2 [a1].Offset(1, 2).Select '行列都偏移 3 [a1].Offset(2).Select '只偏移行 4 [a1].Offset(, 2).Select '只偏移列 5 6 '如果offset前面的range对

学习笔记:offset

很多初学者对于JavaScript中的offset.scroll.client一直弄不明白,虽然网上到处都可以看一张图(图1),但这张图太多太杂,并且由于浏览器差异性,图示也不完全正确. 图一 不知道大家看到这张图的第一感觉如何,反正我的感觉就是“这次第,怎一个乱字了得”. 既然我认为上图太多太乱,那么我就把offset.scroll.client分开说,希望能让大家彻底弄清楚,今天只说offset. 一.关于offset,我们要弄明白什么 w3中offset相关页面是:http://www.w

Directx11学习笔记【十】 画一个简单的三角形

本篇笔记要实现的是在屏幕上渲染出一个三角形,重点要学习的是渲染一个几何体的流程方式. 为了渲染几何图形,需要一个顶点缓存和一个描述顶点布局的输入层,还有着色器(主要是顶点着色器和像素着色器),下面来看看具体Demo的实现. 新建一个Win32项目 ,新建一个类我们叫做TriangleDemo,继承自前面教程我们实现的基类Dx11DemoBase. TriangleDemo.h头文件 #pragma once #include "Dx11DemoBase.h" class Triangl

建筑建模学习笔记1——AutoCAD平面建模

建筑建模学习笔记1--AutoCAD平面建模 楼宇自控项目上位机控制展示软件需要展示成3D效果图,最近在学习3D建模的相关知识.3D建筑物建模多数都是导入2D的CAD建筑图纸,在其基础上进行建模,这样作出的3D模型则会完全与实物相符.现在记录一些AutoCAD画图的命令. 1.划线命令 1)Line 快捷键是 L,工具栏图标 下面是划线的操作动画: 划线时我们看到线不仅有长度还有角度,在在多数情况下画直角的线多一些,AutoCAD提供了正交按钮,在选中此项后,我们画的线与线间的夹角永远都是90度

mysql数据库笔记

虽然select语句可以一次性查出所有的数据,但受计算机屏幕大小的限制,每次只能看到部分行的内容,要看其它内容的时候就要用到滚动条.由于网络的限制,对于web应用来说,这种方式的效率非常低下,数据量比较大的时候几乎是不能使用的. 事实上,通常采用的方法是根据屏幕的大小,一次只查出部分行并显示,如果要看其它的内容,通常采用分页的方式. 那如何在SQL语句中查部分行的内容呢?就要用到limit关键字了. kingbase中可以用下面的语句: 1.查询第一行记录:  select * from 表名