如何用另一个div覆盖一个div

Question

假设我的网页上到处都是 divs B-Z。我有div A，它以

开头插入

  position: absolute !important;
  height: 100% !important;
  width: 100% !important;

它基本上跨越了整个浏览器页面。但是，divA 是隐藏的。

现在，我正在尝试实现文件上传拖放功能。这个想法是这样的：div A 在页面加载后立即隐藏，并且在用户将文件拖到浏览器上之前一直保持隐藏状态。此时，divA 出现了，覆盖了所有其他元素，然后在 drop 之后，它再次隐藏了自己。

在意识到 jquery/ember dragLeave 事件会在进入或离开任何子元素时触发，我现在正在寻找一种方法让 div 覆盖所有其他元素，以便在 @987654327 上发生的所有鼠标事件@A 甚至没有为它下面的元素注册。事实上，当这个div 显示时，甚至不应该看到其他元素。有点像 Photoshop 图层。

我试过Z-index 无济于事。

需要明确的是，divs B-Z 不是div A 的子元素； div A 被简单地插入到所有其他 divs 之前。

Answer 1

如果您希望它位于所有其他 div 之上，则 div A 应该位于所有其他 div 之后（这将在没有 z-index 的情况下工作）。只要其他元素也没有 z-index，正 z-index 就应该起作用。