展开一个div以覆盖另一个div

Question

我正在使用jQuery来扩展div，同时将其覆盖，以便覆盖页面的整个宽度。它包含一个大表，我需要为低分辨率构建，但实际上每个人都有更高的表，所以这是一个公认的解决方法。我的问题是，div“跳”低于其他div，而不是像我希望的那样覆盖它们。有谁知道如何实现这一目标？

我已经创建了一个jsfiddle，所以你得到了主要的想法：http://jsfiddle.net/MRNxt/1/

将鼠标悬停在灰色方框中，使其向右展开，覆盖侧边栏中的＃asd2而非下方。

Answer 1

检查这个小提琴：http://jsfiddle.net/MRNxt/4/

解决方案涉及在展开时向log div添加绝对定位，并在折叠时将其取出。还包括一个小修复，以避免动画时闪烁。

Answer 2

添加此css：

#asd2{
 position:absolute;
 z-index:-1;        
}
#log{
    background:white;
}

示例：http://jsfiddle.net/MRNxt/2/

Answer 3

是否有理由使用lightbox / thickbox之类的东西？

或者，您需要使用绝对定位和z-index。在制作动画之前，我建议你弄清楚你理想的布局。把它放在CSSEdit / Firebug /中，以便你的盒子正好在你想要它们的位置，然后添加到动画脚本就很简单了。

或者只使用现成的灯箱。

Answer 4

这不是完美的答案：

http://jsfiddle.net/MRNxt/7/

但是我在这里使用了一个subContainer，允许你有100％的宽度和一些边框。