jquery - 如何避免父 div 的 Z-index？

Question

我想避免父 div z-index。任何插件都可以吗？

<div id="1"> 
  <div id="2"></div>
</div> 

div with id 1 = 950 of z-index

div 与 id 2 = 1 的 z-index 但在点击事件中它等于 9999 的 z-index。

我有一个弹出窗口 (exposemask) 等于 9998 的 z-index。

我想要做的是在弹出窗口处于事件状态时显示 div 和 id 2。但是，带有 id 1 的 div 会覆盖其 z-index。因为它是 id 2 的 div 的父级，所以我不应该更改 div 的 z-index使用 id 1。

Answer 1

首先，您不能将数字用作 css 选择器 css grammar

如果父级不需要 z-index，您可以这样做:

如果你不给父 div 一个 z-index 会怎样？但是只要给你的子元素一个负的 z-index 值，它就隐藏在父元素的“后面”:

z-index: -1;

每当弹出窗口处于事件状态时，您将为子元素设置一个正的(比弹出窗口更高的 z-index)z-index:

$('#div2').css('z-index', '2');

jsFiddle example

如果你的父元素总是需要一个 z-index(例如，如果这个父元素需要覆盖另一个带有 z-index 的元素)那么这是不可能的:

这是不可能的。如本主题所述:z-index between Children and Parents

All child element z-index is calculated in respect to the parent element. So the one of the 2 elements with the higher z-index will be rendered above the other one and all its child elements.

但是您可以从父元素中获取子元素。

---

我还建议您在必要时将 z-index 增加 1 而不要使用像 99999 这样的大数字。对于大数字，您将不知道您使用了多少 z-index。