我在主页上有一个弹出式咖啡幻灯片 - theCoffeeLocator.com（单击“优势”打开幻灯片。
打开时，幻灯片以半透明的方式使网页的其余部分变暗。我的顶部导航栏 div (id="topstrip") 不会位于变暗的 div (id="jdarken") 后面。
任何想法谢谢
问问题
2084 次
2 回答
3
( #topstripz-index: 995) 放置在#header(z-index: 994) 内#back。
( #jdarkenz-index: 996) 放置在#contentarea(z-index: 1) 内#back。
因为994>1，所有的孩子都#header将被绘制在所有的孩子之上#contentarea。与#jdarken处于不同的堆叠上下文（由 DOM 树中的 z 索引节点分隔）中#topstrip，它们的相对 z 索引无关紧要。
作为解决方案，我建议从#contentarea. 这将放置#jdarken在与 相同的堆栈上下文中#header，因此#jdarken将堆栈在#header（和之上#topstrip）之上，因为996 > 994. 如果我理解正确，z-index#topstrip也未使用，您可以删除该属性而不会产生任何后果。
同样正确的是，必须对元素进行position编辑才能使 z-index 起作用（fixed将做）；但是，这里满足这个条件。
于 2013-01-01T14:31:45.530 回答
0
为了使 z-index 属性起作用，元素应该有一个相对的、绝对的或固定的位置属性。
当我检查你的源代码时，我注意到你的灰色元素位于其他一些元素中，z-index 行为受父母属性的影响，
尝试将您的 id="jdarken" div 重新定位到页面底部，然后尝试。
于 2013-01-01T13:55:41.177 回答