如何获得元素位置 [英] How to get the element position

查看:86
本文介绍了如何获得元素位置的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

大家好,

我想使用javascript获取元素位置.它按照我在下面使用的方式工作
javascript方法.但是当我更改浏览器分辨率时,它给了我
元素位置正确.它总是根据
来计算位置 宽度:1024和高度:800

如何根据分辨率计算位置?

Hi all,

i want get the element postion using javascript. it work as i am using below
javascript method. but when i change the browser resolution then it give me the
element position correct. it always calculated the position acording to
width: 1024 and height:800

How to caluclate the postion according to resolution?

function GetPosition(sender) {
	
  var offsetTrail = sender;
  var offsetLeft = 0;
  var offsetTop = $(sender).outerHeight();
  var p;var count = 0;
  while (offsetTrail) {
    offsetLeft += offsetTrail.offsetLeft;
    offsetTop += offsetTrail.offsetTop;
    p = offsetTrail;count = count + 1;
    offsetTrail = offsetTrail.offsetParent;
   }

	
  if (sender.style.marginLeft != '')
    offsetLeft = offsetLeft - parseInt(sender.style.marginLeft.replace('px',''));
  return { x: offsetLeft , y: offsetTop };
}

推荐答案

(sender).outerHeight(); var p; var count = 0 ; 同时(offsetTrail){ offsetLeft + = offsetTrail.offsetLeft; offsetTop + = offsetTrail.offsetTop; p = offsetTrail; count =计数+ 1 ; offsetTrail = offsetTrail.offsetParent; } 如果(sender.style.marginLeft!= ' ') offsetLeft = offsetLeft- parseInt (sender.style.marginLeft.replace(' ' 返回 {x:offsetLeft,y:offsetTop}; }
(sender).outerHeight(); var p;var count = 0; while (offsetTrail) { offsetLeft += offsetTrail.offsetLeft; offsetTop += offsetTrail.offsetTop; p = offsetTrail;count = count + 1; offsetTrail = offsetTrail.offsetParent; } if (sender.style.marginLeft != '') offsetLeft = offsetLeft - parseInt(sender.style.marginLeft.replace('px','')); return { x: offsetLeft , y: offsetTop }; }


您的代码将为您提供该元素的左下角.开始于:

You code is going to give you the bottom left corner of the element. By starting with:

var offsetTop =


(sender).outerHeight();
(sender).outerHeight();



所有定位均在元素的左上角进行.如果像示例一样循环遍历offsetLeft和offsetTop.您将获得从元素左上角到页面左上角的距离.但是,从元素高度开始的地方,也要考虑到这个因素,以使您的底部左下.

如果将元素绝对定位并固定在左上角,则此结果将始终相同.

仅当您具有中心,右侧或底部锚点或相对(%)大小时,浏览器大小的更改才会影响元素的位置.

以下是我与应用程序一起使用的脚本的摘录.



All positioning works to the top left point of the element. If you loop through offsetLeft and offsetTop like you have in your example. You will get the distance from the top left corner of the element to the top left corner of the page. But where you start with the element height you''ll also have this factored in to give you the bottom left.

This result will always be the same if elements are absolutely positioned and anchored to the top left.

Only if you have centre, right or bottom anchors or relative (%) sizes will a change of browser size effect the position of the element.

The following is a snippit from the script I use with my applications.

var uiHelper = {
  ElementPos: function(el) {
    var result = { x: 0, y: 0 };
    while(el != null) {
      if(el.offsetLeft) {
        result.x += el.offsetLeft;
        result.y += el.offsetTop;
      }
      el = el.parentNode;
    }
  }
}


这篇关于如何获得元素位置的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆