`
Darren_jun
  • 浏览: 11513 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

offsetTop,offsetLeft,offsetWidth,offsetHeight的使用说明

阅读更多

1、offsetTop 是获得 HTML 元素距离上方或外层元素的位置, 返回的是数字;

2、 offsetLeft 是获得 HTML 元素距离左方或外层元素的位置, 返回的是数字;

 

2、offsetWidth 指 obj 控件自身的绝对宽度,不包括因 overflow 而未显示的部分,也就是其实际占据的宽度,整型,单位像素。

 

3、obj.offsetHeight 指 obj 控件自身的绝对高度,不包括因 overflow 而未显示的部分,也就是其实际占据的高度,整型,单位像素。

分享到:
评论

相关推荐

    Javascript拖拽系列文章2之offsetLeft、offsetTop、offsetWidth、offsetHeight属性第1/2页

    Javascript拖拽用到的一些关于位置定位的一些参数

    Js中关于top、clientTop、scrollTop、offsetTop.pdf

    需要注意的是,offsetLeft 和 offsetTop 是相对于上层控件的位置,而不是相对于文档的位置。 六、offsetTop 与 style.top 的区别 * offsetTop 返回的是数字,而 style.top 返回的是字符串,除了数字外还带有单位:...

    JS大全 web编程

    scrollLeft,scrollWidth,clientWidth,offsetWidth完全详解 2009年12月14日,16:58:19 | ArthurXF ...(需要提一下:CSS中的margin属性,与clientWidth、offsetWidth、clientHeight、offsetHeight均无关)

    原生js实现弹出层登录拖拽功能

    实现拖拽功能 ,三个事件 mousemove , mouseup ,mousedown, 偏移量(offsetLeft, offsetTop , offsetWidth ,offsetHeight),窗口坐标位置(clientX ,clientY ) 以及获取可视区域方法的兼容性处理。 之前做的比较多的...

    Javascript拖拽拖放系列文章3之细说事件对象第1/4页

    在阅读本文前,可以先阅读《Javascript拖拽&拖放系列文章2之offsetLeft、offsetTop、offsetWidth、offsetHeight属性》这篇文章,以理清上下文关系。好了,让我们开始进入正题。 模型相同的属性/方法 1 Button属性 ...

    浅析offsetLeft,Left,clientLeft之间的区别

    obj.offsetTop 指 obj 相对于版面或由 offsetParent 属性指定的父坐标的计算上侧位置,整型,单位像素。 obj.offsetLeft 指 obj 相对于版面或由 offsetParent 属性指定的父坐标的计算左侧位置,整型,单位像素。 obj...

    js获取控件位置以及不同浏览器中的差别介绍

    var height=e.offsetHeight; while(e=e.offsetParent) { t+=e.offsetTop; l+=e.offsetLeft; } } 假设 obj 为某个 HTML 控件。 obj.offsetTop 指 obj 距离上方或上层控件的位置,整型,单位像素。 obj.offsetLeft 指...

    Javascript元素位置、大小、鼠标定位操作

    2. offsetWidth 和 offsetHeight:获取元素的宽度和高度,包括边框、padding、margin 等。 3. clientWidth 和 clientHeight:获取元素的宽度和高度,excluding 边框、padding、margin 等。 4. scrollTop 和 ...

    DOM相关内容速查手册

     offsetParent 获取定义对象 offsetTop 和 offsetLeft 属性的容器对象的引用。 offsetTop 获取对象相对于版面或由 offsetTop 属性指定的父坐标的计算顶端位置。 offsetWidth 获取对

    鼠标放上去显示层及信息详情.

    var x = event.x-elm.offsetLeft; x=x<(elm.offsetWidth-w)?x<w?w:x:elm.offsetWidth-w; zoomImg.style.marginLeft=(w-x)*zoomRate; var y = event.y-elm.offsetTop; y=y<(elm.offsetHeight-h)?y<h?h:y:elm....

    JS中各种尺寸的获取

    offsetWidth/offsetHeight——视觉大小:看得见的大小,不包括margin的元素的宽度或高度,只包括padding、border、水平滚动条的宽度或高度。 offsetTop/offsetLeft——当前元素的偏移量:当父级有定位,根据父级的...

    javascript的offset、client、scroll使用方法详解

    offsetTop 指元素距离上方或上层控件的位置,整型,单位像素。 offsetLeft 指元素距离左方或上层控件的位置,整型,单位像素。 offsetWidth 指元素控件自身的宽度,整型,单位像素。 offsetHeight 指元素控件自身的...

    JavaScript 页面坐标相关知识整理

    offsetTop 可以获得 HTML 元素距离上方或外层元素的位置,style.top 也是可以... offsetLeft 与 style.left、offsetWidth 与 style.width、offsetHeight 与 style.height 也是同样道理。 scrollHeight: 获取对象的滚动

    javascript scrollLeft,scrollWidth,clientWidth,offsetWidth 完全详解

    offsetParent 属性指定的父坐标的高度 offsetLeft:获取对象相对于版面或由 offsetParent 属性指定的父坐标的计算左侧位置 offsetTop:获取对象相对于版面或由 offsetTop 属性指定的父坐标的计算顶端位置 event....

    仿淘宝js放大镜效果

    maxWidth = smalmg.clientWidth - showimg.offsetWidth; maxHeight = smalmg.clientHeight - showimg.offsetHeight; //上面两个变量指明showimg允许活动的区域 }; smalmg.onmousemove = function(e){ e = e || ...

    js中的scroll和offset 使用比较的实例与分析

    1.offsetTop :当前对象到其上级层顶部的距离.不能对其进行赋值.设置对象到页面顶部的距离请用style.top属性. 2.offsetLeft :当前对象到其上级层左边的距离.不能对其进行赋值.设置对象到页面左部的距离请用style....

    尝试动手制作javascript放大镜效果

    clientX=A.offsetLeft()+B.offsetLeft+1/2*A.offsetWidth; clientY=A.offsetTop()+B.offsetTop+1/2*A.offsetHeight; 鼠标移动过程中:放大镜A和大图D是一起随鼠标成比例运动的,因为当放大镜A的右边框移动到与小图B的...

    javascript中offset、client、scroll的属性总结

     第一组:offsetWidth,offsetHeight,offsetLeft,offsetTop,offsetParent  第二组:clientWidth,clientHeight,clientLeft,clientTop  第三组:scrollWidth,scrollHeight,scrollLeft,scrollTop  详细定义如下:  ...

    js获取元素相对窗口位置的实现代码

    JS获取元素的offsetTop,offsetLeft等属性 obj.clientWidth //获取元素的宽度 obj.clientHeight //元素的高度 obj.offsetLeft //元素相对于父元素的left obj.offsetTop //元素相对于父元素的top obj.offsetWidth //...

Global site tag (gtag.js) - Google Analytics