lixinlixin2008 发表于 2013-2-7 20:45:36

ie 两个bug(透明和absolute时,隐藏和显示子元素问题)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns:v="urn:schemas-microsoft-com:vml" xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="zh-CN"><head><meta http-equiv="content-type" content="text/html; charset=GB2312"/><style>html,body{height:100%;width :100%;}#wrapper{border:1px solid red;filter:alpha(opacity=80);position:absolute;width:1000px;height:300px;/*height:1000px;*/}#wrapper div{background:transparent url(test.gif);width:100px;height:100px;border:1px solid red;position:absolute;cursor:pointer;}</style><script>function hiddenD(){var divs = document.getElementById("wrapper").getElementsByTagName("div");for(var i=0;i<divs.length;i++){divs.style.display="none";}}function showD(){var divs = document.getElementById("wrapper").getElementsByTagName("div");for(var i=0;i<divs.length;i++){divs.style.display="";}}function hiddenW(){document.getElementById("wrapper").style.display = "none";}function showW(){document.getElementById("wrapper").style.display = "";}</script></head><body><input type="button" value="隐藏wrapper" ><input type="button" value="显示wrapper" ><input type="button" value="隐藏" ><input type="button" value="显示" ><div id="wrapper"><div style="top:0px"></div><div style="top:100px"></div><div style="top:200px"></div><div style="top:300px"></div><div style="top:400px"></div></div></body></html><!--ie6和ie7类似filter:alpha(opacity=80);时,会导致超出wrapper的部分被截断,隐藏wrapper,再隐藏wrapper里面的div, 然后显示wrapper,发现里面的div没有隐藏,这时候再点隐藏,失效了ie8不会截断,不隐藏wrapper的情况下点击显示和隐藏,发现没截断的部分始终会显示,其余浏览器没有此问题-->网名 :天堂左我往右
页: [1]
查看完整版本: ie 两个bug(透明和absolute时,隐藏和显示子元素问题)