JQuery模态不会出现在IE6中的列表框顶部

Question

我有一个aspx页面，其中包含一个JQuery UI模态（modal=true）和一个表中的asp.net列表框。每当调用模态时，它总是显示在列表框后面，而不是顶部。我已经尝试在这两个对象上设置z-Index属性，但这似乎没有太大区别。请注意，我尝试过同时使用绝对和相对定位。

这种情况只发生在IE6中。IE7很好，但不幸的是我需要使用IE6浏览器。

以下是包含ListBox:的表中的行片段

                        <tr style="position: relative; z-index: 80;">
                            <td colspan="3" style="position: relative; z-index: 80;">
                                <asp:ListBox ID="lstSites" runat="server" Height="100px" Width="100%" SelectionMode="Multiple"
                                    ></asp:ListBox>
                            </td>
                        </tr>

这是JQuery:

    <script type="text/javascript">
        $(function () {
            $("#dialog:ui-dialog").dialog("destroy");
            $("#helpModal").dialog({
                autoOpen: false,
                height: 250,
                width: 350,
                modal: true                  
            });
            $("#<%= imgHelpIcon.ClientID %>")
        .click(function () {
            $("#helpModal").dialog("open");
        });
        });

    </script>
<%--Help modal s--%>
<div id="helpModal" class="" title="Help!!" style="z-index: 100;">
    <div style="z-index: 300;">
        <h4>
            Help info.....
        </h4>
    </div>
</div>

有人能提出什么建议吗？

感谢

Answer 1

我知道在IE6中处理这个问题的唯一方法是隐藏ListBox（选择元素）或将弹出窗口放在iframe中。

谷歌搜索"ie6选择z索引错误"以获取更多信息。

Answer 2

您可能想要使用bgiframe解决方法。

编辑：这里有一个更好的答案。