当前位置: 首页 > 面试题库 >

如何使子元素显示在其父元素后面(Z索引更低)?

魏雅惠
2023-03-14
问题内容

我需要一个动态元素始终出现在另一个元素的顶部,无论它们在DOM树中的顺序如何。这可能吗?我已经尝试了z-index(和position:relative),但似乎没有用。

我需要:

<div class="a">
    <div class="b"></div>
</div>

<div class="b">
    <div class="a"></div>
</div>

呈现时完全相同。并且出于灵活性目的(我计划分发需要此功能的插件),我真的不想不必求助于绝对或固定位置。

为了执行我想要的功能,我做了一个条件语句,其中重叠的子元素将在阻止其父视图的情况下变得透明。这不是完美的,但它是某种东西。


问题答案:

如果元素构成层次结构,则不能那样做,因为每个定位的元素都会创建新的堆叠上下文,并且z-index相对于同一堆叠上下文的元素。



 类似资料:
  • 问题内容: 假设我有以下代码: 现在,我需要在上面,但是在jsFiddle中,您可以看到child元素呈现在before之前。 如果您删除 类 或 ,则一切正常。这是我需要的正确行为: http //jsfiddle.net/ZjXMR/1/ 如何在不删除页面的情况下执行此操作? 问题答案: 这是不可能的,因为子级的设置与父级的堆叠索引相同。 您已经通过从父级移除z-index来解决该问题,将其保

  • 问题内容: 当显示其父元素时,是否有任何机制可显示子元素:无? 这种情况是隐藏选项卡上的验证错误。我想显示错误消息,即使该字段是隐藏的。 标记: CSS: 我猜这是不可能的,因为孩子没有上下文,但以防万一? 问题答案: 不,这是不可能的。隐藏该元素,因此不会显示任何子元素。 编辑: 这可能是沿着你想要的线,如果你能够从使用切换到。 使用此方法,您可以隐藏父元素的内容,但显示所需的特定内容。唯一需要

  • 问题内容: 使用D3库将SVG元素置于z顺序顶部的有效方法是什么? 我的特定情况是一个饼图其中突出(通过添加到)当鼠标在给定的片。生成我的图表的代码块如下: 我已经尝试了几种选择,但到目前为止还没有运气。同时使用和调用均无效。 在我的CSS中,“ top”类的定义如下: 该语句可以确保我知道它正确打开/关闭。它是。 我听说过使用是一个选项,但是我不清楚如何将“ selected”元素置于顶部。 更

  • 问题内容: 假设我有这个标记: 我有这个jQuery: 单击该子项时,如何获得子项相对于其父项的索引? 例如,当您单击“步骤1”时,应弹出带有“ 0”的。 问题答案: 但是,与其为每个列表项附加一个单击处理程序,不如(在性能方面)更好地使用如下所示: 在jQuery 1.7+中,您应该使用。下面的示例将事件绑定到元素,就像委托事件一样工作:

  • 我正在开发一个web应用程序,它显示了一个巨大的卡片网格,其高度本质上是可变的。 为了美观起见,我们使用jQuery的来均衡每行卡片的高度。 它的性能没有得到很好的扩展,所以今天我一直在迁移到一个基于flex box的解决方案,它的速度要快得多。 然而,我失去了一个行为——如果卡头的内容不合适,应该用省略号将其截断。 目标: 3列 列宽度变化以填充父 行间距不变 高度在一排内相等 如何安排容器大小

  • 问题内容: 我想动态更新元素的文本: 我是jQuery的新手,因此对我来说,这项任务似乎非常具有挑战性。有人可以指出我要使用的功能/选择器吗? 如果可能的话,我想在不为需要更改的文本添加新容器的情况下执行此操作。 问题答案: 在Javascript中,该属性为您提供元素的所有子节点,包括文本节点。 因此,如果您知道要更改的文本始终是元素中的第一件事,那么请给出以下HTML: 您可以这样做: 当然,