JQuery modal 不会出现在 IE6 中的列表框之上

Question

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

这只发生在 IE6 中。 IE 7 很好，可惜我需要使用 IE6 浏览器。

这是包含 ListBox 的表中的一行 sn-p：

                        <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 select z-index bug”了解更多信息。

Answer 2

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

编辑：这里是a better answer。