`

<转>【IE6的疯狂系列】IE6下使用滤镜后链接不能点击的BUG

 
阅读更多

大家可能都知道IE6下使用DXImageTransform.Microsoft.AlphaImageLoader滤镜(用于PNG32 Alpha透明)后链接不能点击的BUG,大家也都知道只要在a标签上加相对定位的属性(position:relative)就可以点击了。

见demo页面中的例子1:http://www.css88.com/demo/ie6bug_filter/(使用IE6查看);

非常好!但是如果在使用滤镜容器的中加上绝对定位,悲剧发生了!a标签上加相对定位的属性(position:relative)链接依然不能点击!

见demo页面中的例子2:http://www.css88.com/demo/ie6bug_filter/(使用IE6查看);

经过近半个小时的折腾终于有了解决方案,就是在使用滤镜的容器外面再加上一个容器,这个容器加上绝对定位。a标签上加相对定位的属性(position:relative)就可以点击了。

见demo页面中的例子3:http://www.css88.com/demo/ie6bug_filter/(使用IE6查看);

原因可能如下:

DXImageTransform.Microsoft.AlphaImageLoader可能改变了容器的层级,真好正好定位属性也能改变元素层级。

如果你知道原因或者有更好的解决方案欢迎留言斧正,探讨。谢谢!

另:

分享到:
评论

相关推荐

    ie6BUG解决方案

    - **优雅降级**:如果某些效果在IE6下无法完美实现,可以考虑提供一个替代方案,比如使用非透明的背景色或图片,以确保基本功能不受影响。 - **用户教育**:鼓励用户升级到较新版本的浏览器,因为新版本通常有更完善...

    ie6中页面的bug

    9. **透明度处理**:IE6不支持CSS的`opacity`属性,可以使用滤镜`filter:alpha(opacity=xx)`来实现透明效果,但需要注意这会影响性能。 10. **浮动元素的清除**:在IE6中,浮动元素的清除有时会出现问题,可以使用`...

    iebug总结jar包

    6. **CSS选择器限制**:IE6不支持一些高级CSS选择器,如`:hover`在非链接元素上、`:first-child`等,开发者需要使用类名或者其他方法进行替代。 7. **JavaScript兼容性**:IE6对ECMAScript 3的支持有限,不支持某些...

    ie6bug问题解决

    在IT行业中,尤其是在Web开发领域,IE6(Internet Explorer 6)因其众多独特的bug和兼容性问题而闻名。这个压缩包文件"ie6bug"显然专注于解决与IE6相关的技术挑战。下面,我们将深入探讨IE6中的常见问题以及解决策略...

    IE6浏览器完美兼容PNG图片的BUG(包括背景)

    PNG是一种无损压缩的图像格式,支持透明度效果,但在IE6上,尤其是对于带有Alpha透明通道的PNG-24格式图片,会出现显示不正常的情况,即所谓的"PNG BUG"。 首先,我们要理解PNG图像的透明特性。PNG-8格式支持256色...

    Bootstrap-datetimepicker先天bug修复,兼容IE6+

    6. **PNG透明度**:IE6不支持PNG24的透明效果,可以使用AlphaImageLoader滤镜来解决。 7. **DOCTYPE声明**:确保文档使用正确的DOCTYPE,这会影响IE的渲染模式,避免Quirks Mode。 修复以上问题后,Bootstrap-...

    IE6 PNG图片 BUG

    2. **PNG-24透明性问题**:对于PNG-24格式,IE6在默认情况下完全不支持Alpha通道透明,这意味着任何半透明效果都会变成完全不透明。开发者们不得不寻找各种技巧来解决这个问题,比如使用滤镜(filter)属性,如`...

    Web-前端html+css从入门到精通 168. IE低版本常见BUG.zip

    例如,`&lt;audio&gt;`和`&lt;video&gt;`标签在IE8及以下版本无法直接使用,此时可能需要引入Flash插件作为替代方案。 其次,CSS的兼容性问题也是一大挑战。IE低版本对CSS2.1标准的实现存在很多不足,更不用说CSS3的新特性了。...

    IE6, IE7, IE8 CSS 兼容速查表

    2. **透明度支持**:IE6不支持CSS的`opacity`属性,但可以通过滤镜(filter)实现透明效果,如`filter:alpha(opacity=50)`。IE7和IE8则部分支持`opacity`,但效果不如现代浏览器稳定。 3. **浮动元素的清除**:IE6...

    网页排版IE6兼容性问题修改方法

    IE6不支持PNG24位的透明效果,但可以通过CSS滤镜(`filter:progid:DXImageTransform.Microsoft.AlphaImageLoader`)来实现,或者转换为PNG8格式并使用Alpha透明通道。 4. **双边距问题** 当元素设置为`display:...

    IE 常见bug 及其fix

    IE6不支持CSS的`opacity`属性,但可以使用滤镜(filter)实现。例如: ```css #element { filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50); /* IE6-8 */ opacity: 0.5; /* 标准浏览器 */ } ``` 6....

    IE5,IE6,IE7,IE8的css兼容性列表

    在互联网发展的早期,微软的Internet Explorer(IE)浏览器曾经占据主导地位,尤其是IE5、IE6、IE7和IE8这几个版本。每个版本都有其独特的特性和对CSS(层叠样式表)的支持程度,这对于前端开发者来说是必须要了解的...

    IE6支持png

    文件“浮动层在网页中定位.txt”可能详细介绍了如何在IE6下使用浮动层,并解决可能出现的位置偏差问题,因为IE6的布局模型与其他现代浏览器有所不同。 4. **设置最小宽度**:IE6在处理元素的最小宽度时存在bug。...

    IE默认行为中文手册

    2. **浮动元素**:IE在处理浮动元素时可能存在一些bug,比如浮动元素的父级高度计算不正确,可能导致“浮动穿透”现象。手册可能会提供解决这些问题的技巧和补救措施。 3. **CSS兼容性**:IE的不同版本对CSS的支持...

    IE6不支持opacity半透明 BUG的解决方法

    综上所述,通过在CSS中同时使用opacity属性和filter属性中的alpha滤镜,再结合Gradient滤镜调整渐变效果,可以有效地解决IE6不支持opacity半透明的BUG,从而实现一个在多种浏览器中具有相兼容透明度效果的网站界面。...

    IEpng透明通用代码

    这样,即使在IE6下,PNG图像也能展现出预期的透明效果,同时避免了其他浏览器因为不必要的滤镜而可能出现的bug。 总的来说,"IE6png透明通用代码"是一套针对IE6浏览器的解决方案,它利用JavaScript和CSS技巧解决了...

Global site tag (gtag.js) - Google Analytics