asp.net - ASP.net 中菜单和 ajax ModalPopupExtender 的 Z 索引问题

Question

我使用 Ajax ModalPopupExtender，但问题是应用程序中的菜单显示在 ModalPopupExtender 上。我还为 ModalPopupExtender 设置了 z-index=1 ，为 z-index=100 设置了 z-index=100 但问题没有解决。

Answer 1

经过几分钟学习如何使用开发工具(Chrome/IE 上的 F12)，我终于找到了问题的根源。

我将假设以下两件事之一为真:1. 您的主菜单位于母版页上，并且 ModalPopupExtender 控件位于子页面内。2. ModalPopupExtender 控件放置在保存页面其余内容(主菜单除外)的同一 div 中，并且该 div 的 z-index 低于包含主菜单的 div。 (即使您没有明确指定这些 z-index 值，这些 div 也会自动继承值。)

如果您的情况属于第一类，那么会发生以下情况:生成的标记将灯箱放置在一个 div 内，以及子页面内容的其余部分(例如wrapperContent)，并将主菜单放置在另一个 div 内(例如包装头)。 wrapperHeader 的 z 索引必须大于wrapperContent 的 z 索引，否则子菜单在下拉时将落在内容下方。现在，无论您为灯箱指定什么 z-index 值，它都将始终显示在wrapperHeader 内的每个元素下，因为它从wrapperContent 继承其z-index，该z-index 低于wrapperHeader。

如果您的情况属于第二类，则类似的解释如下。

@Jack Marchetti 这也解释了为什么当您将灯箱放置在其自己的 div 中(与页面其余部分的内容分开)时，此问题会被修复。

我希望这会有所帮助。