JavaScript Diary

// 引数は一つで、位置を調べたい要素を与える
// クロスブラウザ(NS4,NS6,IE4,5)を考えるなら、その要素はリンクオブジェクトである
// 返される値はオブジェクトで x, yプロパティ を持つ
// 使用例
function getElementPosition( e, root, x, y ){
    if( document.layers !== void 0 ){
        x = e.$x !== void 0 ? e.$x : e.x ;
        y = e.$y !== void 0 ? e.$y : e.y ;
        return { x:x, y:y };
    }else{
        // 親要素に存在する任意の要素（タグ）を調べる関数
        // 但し、tagName に "cell" を指定した場合のみ、td, th を同時に探索する
        // 存在する場合その要素を、存在しない場合 null を返す
        // BODY タグを発見した場合に再帰は終了する
        function searchParentHTMLElement( e, tagName ){
            if( e === document.body ){
                return null ;
            }else{
                var tname = e.tagName.toLowerCase();
                if( tagName == "cell" ){
                    return tname == "td" || tname == "th" ? e : arguments.callee( e.parentNode, tagName );
                }else{
                    return tname == tagName ? e : arguments.callee( e.parentNode, tagName );
                }
            }
        }
        // 親要素に absolute な要素を含むかを調べる関数
        // 存在する場合その要素を、存在しない場合 null を返す
        // BODY タグを発見した場合に再帰は終了する
        function searchParentDynamicElement( e ){
            if( e === document.body ){
                return null ;
            }else{
                return e.style.position == "absolute" ? e : arguments.callee( e.parentNode );
            }
        }
        // 引数が一つ、つまり最初はここに制御が入る
        if( arguments.length == 1 ){
            // absolute要素でネストされているかを調べ、されている場合
            // rootオブジェクト（それ以上探索する必要のない最高位オブジェクト）に設定する。
            // abolute要素で二重にネストされている場合、恐らくヤバい^^);
            var dynElement = searchParentDynamicElement( e );
            // NS6では調べた値をそのまま返す
            // IEの場合、TABLEタグを調べる必要があるので再帰する
            if( dynElement == null ){
                if( document.all !== void 0 ){
                    return arguments.callee( e, document.body, e.offsetLeft, e.offsetTop );
                }else{
                    return { x:e.offsetLeft, y:e.offsetTop };
                }
            }else{
                if( document.all !== void 0 ){
                    return arguments.callee( e, dynElement,
                        dynElement.offsetLeft+e.offsetLeft,
                        dynElement.offsetTop+e.offsetTop );
                }else{
                    return {
                        x:dynElement.offsetLeft+e.offsetLeft,
                        y:dynElement.offsetTop+e.offsetTop };
                }
            }
        }
        // rootオブジェクトまで調べたら再帰を終了する
        if( e === root ){
            return { x:x, y:y };
        }else{
            // th, td タグの存在を調べる
            var elementCELL = searchParentHTMLElement( e, "cell" );
            if( elementCELL == null ){
                return { x:x, y:y };
            }else{
                // ネストされている場合、各種offset量を加えて再帰する
                var elementTABLE = searchParentHTMLElement( elementCELL, "table" );
                x += elementTABLE.offsetLeft+elementCELL.offsetLeft ;
                y += elementTABLE.offsetTop+elementCELL.offsetTop ;
                if( parseInt( elementTABLE.border ) != 0 ) y += 1 ;
                return arguments.callee( elementTABLE, root, x, y );
            }
        }
    }
}