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

Question

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

我已经创建了它的 jsfiddle，所以你明白了主要思想：http: //jsfiddle.net/MRNxt/1/

将灰色框悬停并使其向右扩展，覆盖边栏中的#asd2，而不是在其下方。

score 3 · Accepted Answer

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

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

score 0 · Accepted Answer

添加这个CSS：

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

score 0 · Accepted Answer

是否有理由不适合使用灯箱/厚箱之类的东西？

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

或者只是使用现成的灯箱。

score 0 · Accepted Answer

这不会是完美的答案：

但在这里我使用了一个 subContainer 来让你拥有 100% 的宽度和一些边框。

4 回答 4