IE6中a标签无法监听到点击事件的总结(转)
IE6 这个必须死的浏览器实在是让人崩溃。。。对于a标签无法点击的bug遇到过N次也是一知半解的简单的添加背景图解决,这次正好在网上看到了一篇总结性的好文。搬过来~~
?
情况一
?
<!--这是 <a> 标签所在容器的背景上画了一个按钮,需要能点击跳转的情况--><a href="http://leyteris.iteye.com/" style="display:block;width:100px;height:40px;" ></a>
由于 <a> 标签没有背景,在 IE6 下将不可点击,鼠标移上后也不会是手型。?
解决方案:给 <a> 标签增加一个透明的图片背景。?
?
情况二
?
<!--这是绝对定位与浮动元素相邻的情况--><a href="http://leyteris.iteye.com/" style="position:absolute;display:block;right:0;top:0;background:url(transparent_bg.png) no-repeat center;">首页</a><div style="float:left;">内容</div>?
当绝对定位元素与浮动元素相邻时,绝对定位的元素在 IE6 下可能会消失(??)。?
解决方案:在两者间插入一些其它标签。
?
情况三
?
<div style=’background:url(bg.png);_background:none;_filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="bg_png8.png");’><a href="http://leyteris.iteye.com/" style="display:block;width:100px;height:100px;">点击访问</a></div>
当 <a> 标签所在容器使用了半透明滤镜时,会造成锚点失效 。该 <a> 标签不可点击,鼠标放上去也不是手型。?
解决方案:去掉滤镜。 这个 bug 的更好解决方案:http://www.css88.com/archives/2916
?
总结发现这三种情况的共同点是:<a> 标签具有 "display:block;" 属性。所以,可能使用 <a> 进行 "display:block;" 本身就不是一个标准的做法,并且这种做法才是各种 bug 的根源吧!