时光博客 - WEB开发中的可用性和用户体验
Tag: bug

IE6遮罩层select的BUG

ie6的BUG太多,其中一个就是遮罩层(div)遮不住select框,而IE7以上版本是没有此问题的。现在来重现一个bug点击查看演示页面

截图03.jpg

大小: 45.82 K
尺寸: 500 x 183
浏览: 371 次
点击打开新窗口浏览全图

下图为 > IE7 效果:

截图02.jpg

大小: 45.93 K
尺寸: 500 x 175
浏览: 277 次
点击打开新窗口浏览全图

遮罩层在IE下面,是遮不住select下拉选择器的。于是采用一个特殊的方法:

虽说div直接盖不住select但是div可以盖iframe,而iframe可以盖select,所以,把一个iframe来当作div的底,这个div就可以盖住select了.

当使用了iframe后发现,弹出界面是透明白色的,而不是想象中的透明黑色,于是在src中加入一个透明网页:

  1. <html> 
  2.     <head> 
  3.         <title></title> 
  4.     </head> 
  5.     <body style="background-color:#000;"></body> 
  6. </html> 

最后的遮罩层div代码如下:

  1. <div id="overlay"> 
  2.     <iframe style="width:100%;height:100%;position:absolute;visibility:inherit;z-index:-1;" src="touming.html" frameborder="0"></iframe> 
  3. </div> 

问题虽然解决了,但是还是不完美,因为遮罩层显示的时候,虽然遮罩层盖住了select,但是如此同时select也消失不见了 = = !

截图04.jpg

大小: 38.59 K
尺寸: 500 x 176
浏览: 259 次
点击打开新窗口浏览全图

[转载]注释在IE中造成文字溢出的研究

在蓝色论坛看到这样一篇帖子 ie中发现新bug重影”》,觉得很有意思。于是在想到底是什么原因造成的呢?便做了以下测试:

实验代码如下:

<!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=gb2312" />
<title>多了一只猪</title>
</head>
<body>
<div style="width:400px">
<div style="float:left"></div>
<!– –>
<div style="float:right;width:400px">↓这就是多出来的那只猪</div>
</div>
</body>
</html>