最近在改寫一些常用的工具,讓他成為server control以加快程式的開發,順便檢視以前所寫的程式。

首先改寫常用的document.getElementById(object_id)改成jQuery習慣的,$(id_name),可以讓整個程式看起來簡潔很多。

function $(id_name)
{
    return (document.getElementById(id_name));
}

另外一個常用的函數是找出指定物件在頁面中的絕對位置。

function getAbsPos(objID) {
    function Pos(objTop,objLeft) {
        this.top=objTop;
        this.left=objLeft;
    }

    var obj=$(objID);
    var objTop=0,objLeft=0;
    while(obj)
    {
        objTop+=obj.offsetTop;
        objLeft+=obj.offsetLeft;
        obj=obj.offsetParent;
    }
    return new Pos(objTop,objLeft);
}

裏面的function Pos(objTop,objLeft)實際上是個類別宣告,目的是讓一個函數可以同時傳回多個值,其實很多程式語言都可以使用類似的手法,讓函數傳回多個值,而不需要宣告為傳位參數。

這個函數用起來沒有什麼問題,卻在設定物件的絕對位置的時候發生了怪異現象。一般而言,我們都是使用$(id_name).style.top,$(id_name).style.left來定位物件的絕對位置。

        $(objID).top=20;
        $(objID).left=20;

在IE裏面一切都很正常,Google Chrome也沒有問題,但是在firefox裏面卻不會工作,查了很久終於得到答案,原來是firefox比較挑剔,一定要指定單位。

        $(objID).top="20px";
        $(objID).left="20px";

如果經過計算的數值則要像下面這樣帶上單位才行。

var IconPos = getAbsPos(IconId);
$(objID).style.top=(IconPos.top+objIcon.offsetHeight).toString()+"px";

創作者介紹

人生四十宅開始 二號宅

漠哥 發表在 痞客邦 留言(0) 人氣()