`
liuyar
  • 浏览: 7124 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

得到页面元素的绝对位置

 
阅读更多

这里所说的绝对位置,指的是页面中一个元素相对于页面左上角的坐标。如果一个元素已经定义了 position: absolute; 的 style,那么它的 left/top 均已指定,可直接获取。大部分的元素并未定义绝对位置,所以,需要使用 js 的方式获取。

 

function getElementPos(o){
	function getLeft(e){ 
		var offset=e.offsetLeft; 
		if(e.offsetParent!=null) offset+=getLeft(e.offsetParent); 
		return offset; 
	}
	function getTop(e){ 
		var offset=e.offsetTop; 
		if(e.offsetParent!=null) offset+=getTop(e.offsetParent); 
		return offset; 
	}
	return{'x':getLeft(o),'y':getTop(o)};
};

 

分享到:
评论

相关推荐

    jQuery获得页面元素的绝对/相对位置即绝对X,Y坐标

    首先,我们来了解一下如何通过jQuery获取页面元素的绝对位置。绝对位置指的是元素相对于整个文档左上角(通常是指标签)的位置。jQuery提供了一个非常方便的方法叫做`offset()`,它可以返回元素相对于文档的偏移量。...

    jQuery获取页面元素绝对与相对位置的方法

    在JavaScript的众多库中,jQuery作为一个广泛使用的库,提供了简单易用的API来帮助开发者获取页面元素的绝对位置和相对位置。本文将详细介绍jQuery中用于获取元素位置的方法,包括offset()和position(),以及如何...

    JS中获取 DOM 元素的绝对位置实例详解

    下面我们将详细介绍几种获取DOM元素绝对位置的方法及其兼容性。 1. `offsetTop` 和 `offsetLeft` `HTMLElement.offsetTop` 和 `HTMLElement.offsetLeft` 属性分别用于获取元素相对于其定位容器(positioning ...

    DOM元素的绝对位置

    在这个函数中,`getBoundingClientRect()`方法提供了元素相对于视口的边界信息,然后加上当前页面的滚动偏移,从而得到元素的绝对位置。这个函数可以在任何有DOM元素引用的上下文中使用,无论元素的定位方式如何。 ...

    用Javascript 获取页面元素的位置的代码

    JavaScript 提供了丰富的属性和方法来帮助我们获取页面元素的位置信息。这些信息可以分为两大类:相对位置和绝对位置。相对位置指的是元素相对于浏览器窗口的位置,而绝对位置指的是元素相对于整个文档的位置。下面...

    JavaScript和jQuery获取input框的绝对位置

    在JavaScript和jQuery的世界里,获取元素的绝对位置是一项常见的任务,尤其当涉及到动态布局或交互设计时。这个主题主要集中在如何获取HTML中的`input`框的精确位置,以便于进行定位或其他操作。以下是对这个知识点...

    setAbsolute.js:获取一个元素或节点列表并将它们的位置更改为绝对位置,同时将它们保持在当前位置

    所有元素现在都被设置为绝对的并且应该在它们相同的位置 请注意,这会删除边距 - 这是因为如果保留边距并且元素被绝对定位,则位置将被边距偏移。 麻省理工学院许可证 (MIT) 版权所有 (c) 特此授予任何人免费...

    js获取元素在浏览器中的绝对位置

    在JavaScript中,获取元素在浏览器中的绝对位置是一个常见的需求,特别是...同时,现代浏览器还提供了`getBoundingClientRect()`方法,它能更直接地返回元素相对于视口的位置,这也是获取元素绝对位置的一个有效途径。

    JavaScript获取对象在页面中位置坐标的方法

    这个`getXY`函数提供了一种通用的方式来获取元素在页面中的绝对位置,适用于所有需要知道元素精确位置的情况,比如动画效果、事件处理等。但需要注意的是,这种方法不考虑CSS定位(如`position: absolute`或`...

    js getBoundingClientRect() 来获取页面元素的位置

    该方法已经不再是IE Only了,FF3.0+和Opera9.5+已经支持了该方法,可以说在获得页面元素位置上效率能有很大的提高,在以前版本的Opera和Firefox中必须通过循环来获得元素在页面中的绝对位置。

    JavaScript控制网页平滑滚动到指定元素位置的方法

    在提供的代码中,`elementPosition` 函数用于获取元素相对于视口的绝对位置。它通过遍历元素的 `offsetParent` 属性来累加元素的 `offsetLeft` 和 `offsetTop`,从而得到元素的坐标。这是一个非常基础且实用的功能,...

    jQuery 实现DOM元素拖拽交换位置的实例代码

    ### jQuery 实现 DOM 元素拖拽交换位置的原理和技术点 在网页中实现 DOM 元素的拖拽功能能够让用户通过直观的方式进行元素的排序、移动等操作,从而提升网站的交互性和用户体验。本文介绍利用 jQuery 库来实现 DOM ...

    获取元素位置的position()与offset()方法区别介绍

    获取元素位置在Web开发中是一个常见需求,尤其在实现滚动监听、动态布局调整、动画效果以及事件监听等场景下。...在实际开发中,结合这两种方法各自的特点,灵活运用,可以有效地解决各种页面元素位置获取的问题。

    JavaScript中计算网页中某个元素的位置

    而对于Firefox,我们可以通过读取`Window.pageXOffset`和`Window.pageYOffset`来获得视窗的横向和纵向滚动偏移量,然后将其加到元素的`left`和`top`值上,从而得到元素的绝对位置。 对于`iframe`的特殊处理,可以...

Global site tag (gtag.js) - Google Analytics