页面各元素位置和距离对象关系图解。 （深入document.documentElement、body.clentTop、div.scrollTop、div.scrollHeight、body.offsetWidth and so on）

Text：
在IE下offset对象是对当前元素到上一级元素的距离，这算是IE很差劲的一个地方，为了这个浪费了不少时间，firefox下则是标准的。为了使两个浏览器兼容，需要做一些处理，下面这个方法是我从网上找的，不记得在哪找得了，比较好用。

var w3c = (document.getElementById) ? true : false;
var agt = navigator.userAgent.toLowerCase();
var ie = ((agt.indexOf("msie") != -1) && (agt.indexOf("opera") == -1) && (agt.indexOf("omniweb") == -1));
var ie5 = (w3c && ie) ? true : false;
var ns6 = (w3c && (navigator.appName == "Netscape")) ? true : false;
var op8 = (navigator.userAgent.toLowerCase().indexOf("opera") == -1) ? false : true;

function GetXYWH(o) {
    var nLt = 0;
    var nTp = 0;
    var offsetParent = o;
    while (offsetParent != null && offsetParent != document.body) {
        nLt += offsetParent.offsetLeft;
        nTp += offsetParent.offsetTop;
        if (!ns6) {
            parseInt(offsetParent.currentStyle.borderLeftWidth) > 0 ? nLt += parseInt(offsetParent.currentStyle.borderLeftWidth) : "";
            parseInt(offsetParent.currentStyle.borderTopWidth) > 0 ? nTp += parseInt(offsetParent.currentStyle.borderTopWidth) : "";
        }
        offsetParent = offsetParent.offsetParent;
        //alert(offsetParent.tagName);
    }
    this.left = nLt;
    this.top = nTp;
    this.width = o.offsetWidth;
    this.height = o.offsetHeight;
}

/* 调用方法 */
var element_obj = new GetXYWH(document.getElementById("right"));  //ID为 right的元素
alert("上边距:" + element_obj.top + " 左边距:" + element_obj.left);

挺详细，来源网络。