根据dom对象或其id获取对象位置的代码

本文介绍了一个用于获取DOM元素在页面上位置的JavaScript函数,适用于不同浏览器环境,包括IE、Firefox、Safari和Opera。
function getPostionByDom(element)
    {
        var el;
        var ua = navigator.userAgent.toLowerCase();
        var isOpera = (ua.indexOf('opera') != -1);
        var isIE = (ua.indexOf('msie') != -1 && !isOpera); // not opera spoof
        if (typeof element == 'object'){
            el = element;
        }
        else{
            el = document.getElementById(element);
        }
        /*if (typeof el.parentNode == 'undefined' || el.style.display == 'none')
        {
            return false;
        }*/

        var parent = null;
        var pos = [];
        var box;
        if(el.getBoundingClientRect) //IE&FF
        {
            box = el.getBoundingClientRect();
            var scrollTop = Math.max(document.documentElement.scrollTop, document.body.scrollTop);
            var scrollLeft = Math.max(document.documentElement.scrollLeft, document.body.scrollLeft);
            return {x:box.left + scrollLeft, y:box.top + scrollTop};
        }
        else if(document.getBoxObjectFor) // gecko
        {
            box = document.getBoxObjectFor(el);
            var borderLeft = (el.style.borderLeftWidth)?parseInt(el.style.borderLeftWidth):0;
            var borderTop = (el.style.borderTopWidth)?parseInt(el.style.borderTopWidth):0;
            pos = [box.x - borderLeft, box.y - borderTop];
        }
        else // safari & opera
        {
            pos = [el.offsetLeft, el.offsetTop];
            parent = el.offsetParent;
            if (parent != el) {
                while (parent) {
                    pos[0] += parent.offsetLeft;
                    pos[1] += parent.offsetTop;
                    parent = parent.offsetParent;
                }
            }
        }

        if (ua.indexOf('opera') != -1 || ( ua.indexOf('safari') != -1 && el.style.position == 'absolute' ))
        {
            pos[0] -= document.body.offsetLeft;
            pos[1] -= document.body.offsetTop;
        }
        if (el.parentNode) { parent = el.parentNode; }
        else { parent = null; }
        while (parent && parent.tagName != 'BODY' && parent.tagName != 'HTML')
        { // account for any scrolled ancestors
            pos[0] -= parent.scrollLeft;
            pos[1] -= parent.scrollTop;
            if (parent.parentNode) { parent = parent.parentNode; }
            else { parent = null; }
        }
        return {x:pos[0], y:pos[1]};
    }

    window.onload = function() {
        debugger;
        var o = getPostionByDom('SubNav');
    }
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值