<分区>
<分区>
<div class="content-wrapper">
<div class="popup">
<div class="close">
</div>
</div>
</div>
.content-wrapper 相对定位并包含所有页面内容(不仅仅是弹出窗口)。
.popup 是绝对定位的。
.close 也是绝对定位的。
当光标进入弹出窗口时,我有一些 javascript 可以关闭(所以我有一个很好的关闭栏出现在侧面)。我发现最好的方法就是使用 jQuery animate 移动。隐藏/显示会产生口吃效果,即使 .stop() 也无法解决。我的问题是试图将 .close 隐藏在 .popup 后面。无论我为两个 div 设置什么 z-index .close 都不会位于 .popup 后面。
是否可以让一个绝对定位的 div 位于另一个绝对定位的 div 中,而另一个绝对定位的 div 位于其父级后面,如果可以,如何实现?
最佳答案
是的,使用 z-index:http://jsfiddle.net/tGd4Q/
HTML:
<div class="content-wrapper">
<div class="popup">
<div class="close">
</div>
</div>
</div>
CSS:
.popup, .close { position: absolute; height: 200px; width: 200px; }
.popup { background: #f00; }
.close { background: #ff0; top: 25px; left: 25px; z-index: -1; }
但这不适用于 IE7 标准。我建议使用 jQuery(或您选择的其他框架)来隐藏 div:
$('.popup .close').hide();
关于css - 将 div 隐藏在其父级后面?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10030386/