0

我在主页上有一个弹出式咖啡幻灯片 - theCoffeeLocator.com(单击“优势”打开幻灯片。

打开时,幻灯片以半透明的方式使网页的其余部分变暗。我的顶部导航栏 div (id="topstrip") 不会位于变暗的 div (id="jdarken") 后面。

任何想法谢谢

4

2 回答 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 回答