由于<select>的优先级高于<div> 在IE6下容易出现漂浮层被下拉框覆盖的情况,IE8下未出现此类问题。
下面是页面代码:
1 <div id='img' style='position:absolute;z-index:9999999;' onmouseover='mystop()' onmouseout= 'start()' runat="server"> 2 <table border="0" cellpadding="0" cellspacing="0"> 3 <tr> 4 <td> </td> 5 <td align="right"><img src="images/chacha.jpg" onclick="javascript:document.getElementByIdx('img').style.display='none'" style="cursor:hand"/></td> 6 </tr> 7 <tr> 8 <td colspan="2"><asp:Literal ID="ads" runat="server"></asp:Literal></td> 9 </tr> 10 </table> 11 <iframe src="" frameborder="0" style="filter:chroma(color=#ffffff);position:absolute;visibility:inherit;top:0px;left:0px;expression_r(this.parentNode.offsetWidth);height:expression_r(this.parentNode.offsetHeight);z-index:-1;filter='progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=0)';"></iframe> 12 </div> 13 <script language='javascript'> 14 var xPos = 800;var yPos = 0; var step = 1;var delay = 10;var height = 0; var Hoffset = 0;var Woffset = 0; var yon = 0;var xon = 0; var xon = 0; var interval; 15 var img = document.getElementByIdx('img'); 16 img.style.top = 0; 17 function changePos(){ 18 width = document.body.clientWidth; 19 height = document.body.clientHeight; 20 Hoffset = img.offsetHeight; 21 Woffset = img.offsetWidth; 22 img.style.left = xPos + document.body.scrollLeft; 23 img.style.top = yPos + document.body.scrollTop; 24 if (yon) { 25 yPos = yPos + step; 26 }else { 27 yPos = yPos - step; 28 } 29 if (yPos < 0) { 30 yon = 1; 31 yPos = 0; 32 } 33 if (yPos >= (height - Hoffset)) { 34 yon = 0; 35 yPos = (height - Hoffset); 36 } 37 if (xon) { 38 xPos = xPos + step; 39 }else { 40 xPos = xPos - step; 41 } 42 if (xPos < 0) { 43 xon = 1; 44 xPos = 0; 45 } 46 if (xPos >= (width - Woffset)) { 47 xon = 0; 48 xPos = (width - Woffset); 49 } 50 } 51 function start() { 52 img.visibility = 'visible'; 53 interval = setInterval('changePos()', delay); 54 } 55 function mystop(){ 56 clearInterval(interval) 57 } 58 start() 59 </script>
上面的代码在IE6下测试过页面上包含的所有下拉框都处在这个漂浮层的下面。
其中的:
<iframe src="" frameborder="0" style="filter:chroma(color=#ffffff);position:absolute;visibility:inherit;top:0px;left:0px;expression_r(this.parentNode.offsetWidth);height:expression_r(this.parentNode.offsetHeight);z-index:-1;filter='progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=0)';"></iframe>
是最关键的。