读书人

问下IE下Select和Iframe的关系。解决思

发布时间: 2012-04-13 13:50:24 作者: rapoo

问下IE下Select和Iframe的关系。。
下面的CODE用IFF和OP测试均可以显示SELECT元素,可是IE就不能显示,这个东西怎么解决??

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN " "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
<html xmlns= "http://www.w3.org/1999/xhtml ">
<head>
<meta http-equiv= "Content-Type " content= "text/html; charset=gb2312 " />
<title> 全屏 </title>
<style type= "text/css ">
#Dall_screen, #Iall_screen {
position:absolute;
left:0px;
top:0px;
}

#Dall_screen {
z-index:100;
background-color:#F4F4F4;
filter:alpha(opacity=30);
opacity:0.3;
}

#Iall_screen {
z-index:99;
filter:alpha(opacity=0);
opacity:0;
}

</style>
<script type= "text/javascript ">
var $ = function (id) {
//获取对象
return document.getElementById(id);
};

var all_screen = function () {
var div, iframe;
document.body.innerHTML += ' <div id= "Dall_screen ">   <\/div> <iframe id= "Iall_screen " frameborder= "0 "> <\/iframe> ';
div = $( "Dall_screen "), iframe = $( "Iall_screen ");
div.style.height = iframe.style.height = Math.max(document.documentElement.scrollHeight, document.documentElement.clientHeight) + "px ";
div.style.width = iframe.style.width = Math.max(document.documentElement.scrollWidth, document.documentElement.clientWidth) + "px ";
};
</script>
</head>
<body>
<select>
<option> </option>
<option> </option>
<option> </option>
<option> </option>
</select>
<input type= "button " value= "添加 " onclick= "all_screen() " />
</body>
</html>

[解决办法]
....
IE 有两个怪胎, 你一次都弄了,,,服了....
[解决办法]
是的,IE6下米办法!

IE7可以,但是IE7下FLASH又会消失了!
[解决办法]
hehe,两个怪胎就是select和iframe
这两个东西在显示的优先级和正常的元素不一样
这个在IE中,iframe会盖住select的
所以要想实现这个全屏的效果,只能不嫌麻烦了
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN " "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
<html xmlns= "http://www.w3.org/1999/xhtml ">
<head>
<meta http-equiv= "Content-Type " content= "text/html; charset=gb2312 " />
<title> 全屏 </title>
<style type= "text/css ">
#Dall_screen, #Iall_screen {
position:absolute;
left:0px;
top:0px;
}

#Dall_screen {
z-index:100;
background-color:#F4F4F4;
filter:alpha(opacity=30);
opacity:0.3;
}

#Iall_screen {
z-index:99;
filter:alpha(opacity=0);
opacity:0;
}

</style>
<script type= "text/javascript ">
var $ = function (id) {
//获取对象


return document.getElementById(id);
};
var delete_select=function()
{
var objs=document.getElementsByTagName( "select ")
for(var i=0;i <objs.length;i++)
{
objs[i].disabled=true
}
}
var all_screen = function () {
var div;
document.body.innerHTML += ' <div id= "Dall_screen ">   <\/div> ';
div = $( "Dall_screen "),
delete_select.call(null,null);
div.style.height = Math.max(document.documentElement.scrollHeight, document.documentElement.clientHeight) + "px ";
div.style.width = Math.max(document.documentElement.scrollWidth, document.documentElement.clientWidth) + "px ";
};
</script>
</head>
<body>
<select>
<option> </option>
<option> </option>
<option> </option>
<option> </option>
</select>
<input type= "button " value= "添加 " onclick= "all_screen() " />
</body>
</html>

读书人网 >JavaScript

热点推荐