让层遮挡select（ie6下的问题）

虽然现在很多比较大的网站已经不考虑ie6了，不过这些方法，或者其中原理还是值得记录下来的。所以整理的时候，把这篇文章留下了。

<script language="javascript">

var ie55up = IsIE55Up();
var overIframe = null;

function DivOver(objID)
{
var obj = document.all[objID];
// 只有IE5.5以上Iframe的z-index才有效
if (ie55up)
{
if (overIframe == null)
{
overIframe = document.createElement("<iframe src='about:blank' style='position:absolute;left:0;top:0;z-index:998;display:none' scrolling='no' frameborder='0'></iframe>");
}
document.body.insertAdjacentElement("beforeEnd",overIframe);
with(overIframe.style)
{
top = obj.style.top;
left = obj.style.left;
width = obj.offsetWidth;
height = obj.offsetHeight;
display = 'block';
}
obj.style.zIndex = "999";
}
else // 隐藏被ID为objID的对象（层）遮挡的所有select
{
var sels = document.getElementsByTagName_r('select');
for (var i = 0; i < sels.length; i++)
  if (Obj1OverObj2(document.all[objID], sels))
sels.style.visibility = 'hidden';          
}
}

//判断obj1是否遮挡了obj2
function Obj1OverObj2(obj1, obj2)
{
  var pos1 = getPosition(obj1)
  var pos2 = getPosition(obj2)
  var result = true;
  var obj1Left = pos1.left - window.document.body.scrollLeft;
  var obj1Top = pos1.top - window.document.body.scrollTop;
  var obj1Right = obj1Left + obj1.offsetWidth;
  var obj1Bottom = obj1Top + obj1.offsetHeight;
  var obj2Left = pos2.left - window.document.body.scrollLeft;
  var obj2Top = pos2.top - window.document.body.scrollTop;
  var obj2Right = obj2Left + obj2.offsetWidth;
  var obj2Bottom = obj2Top + obj2.offsetHeight;
  
  if (obj1Right <= obj2Left || obj1Bottom <= obj2Top ||
      obj1Left >= obj2Right || obj1Top >= obj2Bottom)
    result = false;
  return result;
}

// 获取对象的坐标
function getPosition(Obj)
{
for (var sumTop=0,sumLeft=0;Obj!=window.document.body;sumTop+=Obj.offsetTop,sumLeft+=Obj.offsetLeft, Obj=Obj.offsetParent);
return {left:sumLeft,top:sumTop}
}

// 是否IE5.5以上版本
function IsIE55Up () {
var agt = navigator.userAgent.toLowerCase();
var isIE = (agt.indexOf("msie")!=-1);
if (isIE)
{
var stIEVer = agt.substring(agt.indexOf("msie ") + 5);
var verIEFull = parseFloat(stIEVer);
return verIEFull >= 5.5;
}
return false;
}
</script>
<script>
    window.onload = function(){DivOver("div1")}
</script>

<div style="position: absolute;left:10px;top:20px;width:200px;height:85px;border:1px solid red;" id="div1">
看看现在这个层下面的select不是简单的隐藏了：）
</div>
<select name="">
<option>test1</option>
<option>test2</option>
<option>test3</option>
</select>

<select name="">
<option>test1test1test1test1test1test1test1test1test1test1test1test1test1test1</option>
<option>test2</option>
<option>test3</option>
</select>

<select name="">
<option>test1</option>
<option>test2</option>
<option>test3</option>
</select>

最后自己先点评下：
上面的方法可以解决这个问题。不过有时也会只出现ifram白块，但要显示的东西没有出来这时你要修改“overIframe = document.createElement("<iframe src='about:blank' style='position:absolute;left:0;top:0;z-index:998;display:none' scrolling='no' frameborder='0'></iframe>");”为“overIframe = document.createElement("<iframe src='about:blank' style='position:absolute;left:0;top:0;display:none' scrolling='no' frameborder='0'></iframe>");”，就是去掉其中的“z-index:998;”，然后后面的“obj.style.zIndex = "999";”也可以不要，不过最好还是按上面的写。
希望可以帮大家解决问题。