IE6对haslayout处理的bug 进入全屏
在IE6下,对haslayout的处理,存在一个非常诡异的bug,直接导致浏览器崩溃!
代码片段1:
<a href="#">aaaa</a>
现象:鼠标滑过时不影响<a>标签的haslayout属性。正常。
代码片段2:
<style type="text/css"> a:hover{zoom:1;} </style> <a href="#">aaaa</a>
现象:鼠标滑过时触发<a>标签的haslayout属性。正常。
代码片段3:
<a style="position:absolute;" href="#">aaaa</a>
现象:鼠标滑过时不影响<a>标签的haslayout属性。正常。
代码片段4:
<style type="text/css"> a:hover{zoom:1;} </style> <a style="position:absolute;" href="#">aaaa</a>
现象:鼠标滑过时触发<a>标签的haslayout属性。正常。
代码片段5:
<a style="position:relative;" href="#">aaaa</a>
现象:鼠标滑过时不影响<a>标签的haslayout属性。正常。
代码片段6:
<style type="text/css"> a:hover{zoom:1;} </style> <a style="position:relative;" href="#">aaaa</a>
现象:鼠标滑过时触发<a>标签的haslayout属性。浏览器崩溃。
结论:对于一个“inline”级别(默认haslayout=-1)的标签,设置了其position为relative,
并且没有通过css触发其haslayout(可通过width、height、zoom等触发);
此时,如果试图通过<style type="text/css">a:hover{zoom:1;}</style>这样的形式
去触发其haslayout,就会造成页面崩溃!
最保险的办法:给position为relative的inline标签,加上“zoom:1;”这个样式!