浏览 2492 次
|
精华帖 (0) :: 良好帖 (0) :: 新手帖 (7) :: 隐藏帖 (0)
|
|
|---|---|
| 作者 | 正文 |
|
发表时间：2009-08-18
<!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[i].style.display="none";
}
}
function showD(){
var divs = document.getElementById("wrapper").getElementsByTagName("div");
for(var i=0;i<divs.length;i++){
divs[i].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" onclick="hiddenW()">
<input type="button" value="显示wrapper" onclick="showW()">
<input type="button" value="隐藏" onclick="hiddenD()">
<input type="button" value="显示" onclick="showD()">
<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的情况下点击显示和隐藏,发现没截断的部分始终会显示,其余浏览器没有此问题
-->
网名 : 天堂左我往右
声明：ITeye文章版权属于作者，受法律保护。没有作者书面许可不得转载。
推荐链接
|
| 返回顶楼 | |
|
发表时间：2009-08-25
IE下的bug这么多呢。开发时要谨慎谨慎啊。
|
| 返回顶楼 | |
