★100分★火狐下窗口onresize的时候DIV的位置调整的有关问题 _JavaScript

★★100分★★火狐下窗口onresize的时候DIV的位置调整的问题
我设置了一个DIV的菜单，使它和input框下面对齐，现在在窗口尺寸变化的时候DIV的位置会跑偏，我使用了onresize来重新定位，在IE下好使，但是火狐下就不起作用有没有什么好办法能适应两种浏览器。
代码如下：
样式：
#box{ width:100px; height:100px; background-color:#999999; position:fixed;_position:absolute; top:200px; left:600px;}

JS片断：
function showdiv()
{
var divid=document.getElementById("box");
var btn=document.getElementById("q");
divid.style.left=getAbsoluteLeft(btn); //可以通过加减来控制一定的偏移量。
divid.style.top=getAbsoluteTop(btn);
}

getAbsoluteLeft = function(obj){
//获取指定元素左上角的横坐标（相对于body）
/*
obj | 指定的元素对象
*/
var selfLeft = 0;
var element = obj;
while(element){
selfLeft = selfLeft + element.offsetLeft;
element = element.offsetParent;
};
return selfLeft;
}

getAbsoluteTop = function(obj){
//获取指定元素左上角的纵坐标（相对于body）
/*
obj | 指定的元素对象
*/
var selfTop = 0
var element = obj;
while(element){
selfTop = selfTop + element.offsetTop;
element = element.offsetParent;
};
return selfTop;
}

HTML片断:

<body onload="showdiv();" onresize="showdiv()">
<div id="box" style="display:none">
<table border="0" width="80%" cellspacing="1" >
<tr>
<td align="rgiht" nowrap>
 
<font color="#ffffff">检索词：</font>
</td>
<td align="left" width="100">
<input type="text" size="65" name="q" id="q" />
</td>
<td align="left">  
<input type="image" src="/images/button_search_1.gif"/>
</td>
</tr>
</table>

------解决方案--------------------
如果你用过jquery的话，下面这段代码可能对你有用：

HTML code


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>居中显示</title>
<script type="text/javascript" src="http://www1.zhaopin.com/Publish/Company/common/jquery/1.3.2pack/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){

    var container = $("#container");

    (function(){
        var _size = _getPageSize();
        container.css({
            height: _size[3]
        });
    })();

    $(window).resize(function(){
        var _size = _getPageSize();
        container.css({
            height: _size[3]
        });
    });
    
    function _getPageSize() {
        var xScroll, yScroll;
        if (window.innerHeight && window.scrollMaxY) {    
            xScroll = window.innerWidth + window.scrollMaxX;
            yScroll = window.innerHeight + window.scrollMaxY;
        } else if (document.body.scrollHeight > document.body.offsetHeight){ // all but Explorer Mac
            xScroll = document.body.scrollWidth;
            yScroll = document.body.scrollHeight;
        } else { // Explorer Mac...would also work in Explorer 6 Strict, Mozilla and Safari
            xScroll = document.body.offsetWidth;
            yScroll = document.body.offsetHeight;
        }
        var windowWidth, windowHeight;
        if (self.innerHeight) {    // all except Explorer
            if(document.documentElement.clientWidth){
                windowWidth = document.documentElement.clientWidth; 
            } else {
                windowWidth = self.innerWidth;
            }
            windowHeight = self.innerHeight;
        } else if (document.documentElement && document.documentElement.clientHeight) { // Explorer 6 Strict Mode
            windowWidth = document.documentElement.clientWidth;
            windowHeight = document.documentElement.clientHeight;
        } else if (document.body) { // other Explorers
            windowWidth = document.body.clientWidth;
            windowHeight = document.body.clientHeight;
        }    
        // for small pages with total height less then height of the viewport
        if(yScroll < windowHeight){
            pageHeight = windowHeight;
        } else { 
            pageHeight = yScroll;
        }
        // for small pages with total width less then width of the viewport
        if(xScroll < windowWidth){    
            pageWidth = xScroll;        
        } else {
            pageWidth = windowWidth;
        }
        arrayPageSize = new Array(pageWidth,pageHeight,windowWidth,windowHeight);
        return arrayPageSize;
    };
});
</script>
</head>

<body style="margin:0px;">
<table id="container" width="100%" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td align="center" valign="middle">
        <div style="width:200px; height:100px; border:#000000 1px solid;">
        
        </div>
    </td>
  </tr>
</table>
</body>
</html>