★★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>
[解决办法]
ls的在ff中怎么延迟呢
[解决办法]
顶一个先
[解决办法]
[解决办法]
恭喜，~~~jF
[解决办法]
jf
[解决办法]
恭喜LZ解决问题了，以后要习惯的加上PX
浏览器兼容是门“学问”，呵呵
[解决办法]
哎，IE的容错性，也不知道是帮人还是害人了
写代码还是尽量按标准来吧
[解决办法]
gx了，另学习了，px。。以前真没注意