Question

我在aspx页面中创建了jquery弹出对话框和asp.net下拉列表控件。

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js" type="text/javascript" ></script>
<script src="//code.jquery.com/ui/1.10.0/jquery-ui.js"  type="text/javascript" ></script>
<script type="text/javascript">

    $(document).ready(function () {

        $('#div_popup').dialog({     
            resizable: true,               
            height: 300,
            width: 300,
            position: 'center',
            zIndex: 10000              
        });

    });
</script>


<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.0/themes/base/jquery-ui.css" type="text/css" />
<style type="text/css" >
    #div_dropdownlist
    {
        margin-left : 50%;
        margin-top : 50%;     
        z-index: -1;        
    }
    #div_popup
    {}
</style>
</head>
<body>
<form id="form1" runat="server">
<div id="div_dropdownlist">
    <asp:DropDownList runat="server" ID="ddlList" Width="200px"></asp:DropDownList>
</div>
<div id="div_popup">
        My test Popup
</div>
</form>
</body>
</html>

我的目的是在将其拖动到其他控件上时，在每个其他控件上弹出jquery对话框除IE6外，所有浏览器都能正常运行。

enter image description here

我试过css zIndex。但它在IE6中没有任何效果。

所以，请告诉我如何在IE6中将其更正。

更新

我将div pop样式更改为

#div_popup
    {
        z-index: 10000;        
    }

我已将我的jquery对话框css样式更改为

$('#div_popup').dialog({     
            ...

            zIndex: 10000              
        });

但在IE6中，当我浏览该控件时，该jquery弹出窗口无法显示在asp.net下拉列表框中。

供您参考，此处为my_source_code。

Answer 1

如http://coding.smashingmagazine.com/2009/09/15/the-z-index-css-property-a-comprehensive-look/中所述有一个ie bug，选择框显示在顶部。我会按建议隐藏选择框或使用垫片for ie。

IE6中的Jquery Dialog和asp.net下拉列表z-index问题

1 个答案: