天天看點

javascript求元素到頁面的絕對距離

/*

     * 求元素到頁面的絕對距離:

     * 直接使用函數的傳回值

     * 例如:getPos("元素").left,得到元素距離左側的絕對距離

     *         getPos("元素").top,得到元素距離上側的絕對距離

     */

    function getPos(ele) {

        // 初始左邊距和上邊距都為0

        var l = 0;

        var t = 0;

        // 當元素存在定位父級(即ele.offsetParent不為null)時,執行本循環内的代碼塊

        while (ele.offsetParent) {

            // 初始的邊距累加元素的邊距和邊框寬度

            l += ele.offsetLeft + ele.offsetParent.clientLeft;

            t += ele.offsetTop + ele.offsetParent.clientTop;

            // 将元素替換為元素的定位父級(疊代)

            ele = ele.offsetParent;

        }

        // 等上面的循環體結束後才會輸出{}

        return {

            'left': l,

            'top': t

        };

    }      

繼續閱讀