当前位置: 代码迷 >> Web前端 >> 取得网页元素的坐标以及大小
  详细解决方案

取得网页元素的坐标以及大小

热度:35   发布时间:2012-11-13 10:00:50.0
获得网页元素的坐标以及大小
region = function(o){
    var x = 0,y = 0,w = 0,h = 0;
    switch(o.length){
      case 1:
        var r = region([]);
        var m = o[0];
		var e = o[0];
        w = m.offsetWidth;
        h = m.offsetHeight;
        if (m.getBoundingClientRect) {
			x = m.getBoundingClientRect().left + r.x - $([]).documentElement.clientLeft;
			y = m.getBoundingClientRect().top + r.y - $([]).documentElement.clientTop;
		}
		else {
			for (; m; x += m.offsetLeft, y += m.offsetTop, m = m.offsetParent);
			for (var e = e.parentNode; e && e != document.body; e = e.parentNode) {
				if (e.scrollTop) y -= e.scrollTop;
				if (e.scrollLeft)x -= e.scrollLeft;
			}
		}
        break;
      default:
        x = Math.max($([]).documentElement.scrollLeft,$([]).body.scrollLeft);
        y = Math.max($([]).documentElement.scrollTop,$([]).body.scrollTop);
        w = $([]).documentElement.clientWidth;
        h = $([]).documentElement.clientHeight;
    }
    return {'x':x,'y':y,'width':w,'height':h};
  }


贴一张经典的示意图帮助理解:



  相关解决方案