将DIV放在同一个地方,切换它们

时间:2013-01-07 21:19:16

标签: css html positioning

我遇到了几个DIV的问题。

我需要将两个DIV放置在完全相同的位置,然后切换它们。随着一个div消失,另一个div应该出现。我将使用jQuery toggle()。

问题是两个DIV都应该是页面流的一部分,并且位置完全相同。我将如何实现这一目标?

所以,有一些以前的div,占据一些地方,有相对定位和非固定大小(取决于窗口测量)

<div class="header">
... </div>

然后我的div

<div id="galleria" style="height:700px;width:920px; margin:0 auto; border:1px solid green;   ">
 ... </div>

和我的其他DIV

<div id="aboutDiv" >
This is ABOUT
</div>

两个后来的div应该占据同一个地方。我可以使用哪些定位标签?

由于灵活的元素,设计调整到窗口大小 - 非常第一个DIV“标题”,因此无法进行绝对定位。

2 个答案:

答案 0 :(得分:4)

一个接一个地把它们放在一起

<div id="galleria" style="height:700px;width:920px; margin:0 auto; border:1px solid green;   "> ... </div>
<div id="aboutDiv" >
This is ABOUT
</div>

两者都应该定位relative,当一个被隐藏,然后其他人将向上移动并且它们将在同一个地方 - 只要您使用切换以始终有一个隐藏且一个显示

答案 1 :(得分:0)

您需要一个相对定位的父容器,其中包含绝对定位的子容器,或者隐藏一个容器并在其完全淡出时显示另一个容器