怎么不让iframe完全遮住DropDownList
日期：2014-05-18 浏览次数：20542 次
如何不让iframe完全遮住DropDownList
大家都知道div遮不住dropdownlist，但是用一个iframe就可以遮住dropdownlist。
我现在要实现这样的效果，
不使用windows的open等来弹出对话框，而是使用div来模拟一个模态对话框，并且模态显示的时候，用一个大的div来遮住整个页面，同时，div是半透明的，这样就可以看见背后的控件。
问题是，这样，dropdownlist会整个都被遮住，看不见，而不是那种半透明的效果。
如果大家用过微软Ajax中的模态对话框控件（ModalPopup control）的话，就很容易看到这种效果，但是我在Ajax自带的例子里的ModalPopup页面里，放上一个DrowDownList，同样也会被遮住看不见。
请问大家有没有什么好办法，多谢了 。
------解决方案--------------------
body.style.background = "transport "
You may try this css, I don 't sure it will help you
------解决方案--------------------
我也早发现DropDownList控件的特殊，当时是用JS生成一个DIV实现菜单，就只有DropDownList控件会引起DIV的变形，其他都很好，也一直没有深入去研究为什么。
实在不行看是否能够用排版实现DropDownList控件与模拟窗口错开。
------解决方案--------------------
try this:
两个分别放在单独的DIV中，然后通过CSS的z-index来控制。
------解决方案--------------------
是这种效果？
<!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>
</head>
<body>
<form id= "form1 " name= "form1 " method= "post " action= " ">
<div id= "a " style= "position:absolute; ">
<select name= "select ">
<option value= "1 "> 1 </option>
<option value= "2 "> 2 </option>
<option value= "3 "> 3 </option>
</select>
abcdef
</div>
<div id= "b " style= "position:absolute;width:300px;height:300px;background-color:#CCCCCC;filter:alpha(opacity=50); ">
</div>
</form>
</body>
</html>
大家都知道div遮不住dropdownlist，但是用一个iframe就可以遮住dropdownlist。
我现在要实现这样的效果，
不使用windows的open等来弹出对话框，而是使用div来模拟一个模态对话框，并且模态显示的时候，用一个大的div来遮住整个页面，同时，div是半透明的，这样就可以看见背后的控件。
问题是，这样，dropdownlist会整个都被遮住，看不见，而不是那种半透明的效果。
如果大家用过微软Ajax中的模态对话框控件（ModalPopup control）的话，就很容易看到这种效果，但是我在Ajax自带的例子里的ModalPopup页面里，放上一个DrowDownList，同样也会被遮住看不见。
请问大家有没有什么好办法，多谢了 。
------解决方案--------------------
body.style.background = "transport "
You may try this css, I don 't sure it will help you
------解决方案--------------------
我也早发现DropDownList控件的特殊，当时是用JS生成一个DIV实现菜单，就只有DropDownList控件会引起DIV的变形，其他都很好，也一直没有深入去研究为什么。
实在不行看是否能够用排版实现DropDownList控件与模拟窗口错开。
------解决方案--------------------
try this:
两个分别放在单独的DIV中，然后通过CSS的z-index来控制。
------解决方案--------------------
是这种效果？
<!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>
</head>
<body>
<form id= "form1 " name= "form1 " method= "post " action= " ">
<div id= "a " style= "position:absolute; ">
<select name= "select ">
<option value= "1 "> 1 </option>
<option value= "2 "> 2 </option>
<option value= "3 "> 3 </option>
</select>
abcdef
</div>
<div id= "b " style= "position:absolute;width:300px;height:300px;background-color:#CCCCCC;filter:alpha(opacity=50); ">
</div>
</form>
</body>
</html>
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
