网页弹出的层被Flash 或Select 下拉列表阻挡的解决方法！

今天在做网页的时候，我想在flash上放一个层，然后放图片等内容，可是总是被flash遮挡，因此总结了一下
对于这方面的问题的几个解决方法，希望可以对朋友和自己有帮助！


1.flash把层遮挡住了，如何处理呢？
==================================================================

在Flash里面加两个参数：
<param name="wmode" value="transparent">
<param name="wmode" value="Opaque">

说明：
<param name="wmode" value="transparent"> FLASH将透明
<param name="wmode" value="Opaque"> FLASH仍将保持不透明

Flash的例子：

  <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="760" height="80">
<param name="movie" value="http://ad.1m1m.com/AdFiles/200774817589544.swf">
<param name="quality" value="high">
<embed src="http://ad.1m1m.com/AdFiles/200774817589544.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="760" height="80"></embed>
<param name="wmode" value="transparent"> 
<param name="wmode" value="Opaque">
</object>

2.如果是弹出的层<div></div> 被<select> 下拉列表所阻挡，有2个方法可以解决！
 
==================================================================
方法一：

<IFRAME>可以遮挡住<SELECT>。所以要使层能够遮挡住下面的列表，只要在层中加入一个和层相同大小的<Iframe>就可以了。
具体做法如下：
<DIV>
<!--//原来的内容//-->
<IFRAME width="100%" height="100%" style="position:absolute; top:0px; z-index:-1; border-style:none;"></IFRAME>
</DIV>
这个方法对于透明的或外形不规则的层无效。原因很简单，<IFRAME>是方的，最大的应用我想就是菜单了。用这种方法，再也不会出现菜单被列表破坏的尴尬了。

方法二：

 

<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('select'); 
  for (var i = 0; i < sels.length; i++) 
    if (Obj1OverObj2(document.all[objID], sels[i]))
   sels[i].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>
<P />


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


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