Question

是否可以将div相对于另一个div定位，而不是它的父亲？例如：

<div id="header"><!-- --></div>
<div id="content"><!-- --></div>
<div id="footer"><<!-- --></div>

在上面的代码中，#footer可以相对定位到#header吗？

更新

我问，因为我想要实现的设计的语义结构与我想呈现它的方式不匹配。在视觉上我会在页面顶部有一个菜单和一个隐藏的div，它将在点击事件的菜单上方滑动。因此，我需要调整顺序或div，以使#menu相对定位在#header下方，并且当#header滑入jQuery slideToggle()事件时保持相对定位

<div id="menu"><!-- --></div>
<div id="header"><!-- --></div>
<div id="content"><!-- --></div>
<div id="footer"><<!-- --></div>

#header应固定在窗口顶部。 #menu应相对于#header定位，以便当#header滑入时，#menu向下滑动相同的距离。

Answer 1

是。你还没有说出你希望它们如何定位，但是你可以使用offset来获得#header的当前位置：

var pos = $("#header").offset();

...您可以根据需要通过#footer设置css的位置：

$("#footer").css({
    position: "absolute",
    left:     /* some value here*/,
    top:      /* some value here*/
});

...或通过offset：

$("#footer").offset({
    left:     /* some value here*/,
    top:      /* some value here*/
});

...其中（在任何一种情况下）根据标题的位置填写所需的左侧和顶部值。

offset接受left和top的数字。 Archer在css的评论中告诉我们，并为我们添加了"px"，这似乎确实有效，尽管我在文档中没有看到它，所以我'我总是把“px”放在自己身上。

Answer 2

How do I move an HTML element in jQuery?

这个问题提供了我需要的答案。基本上你可以使用jQuery在页面加载时移动DOM中的元素;请注意，在尝试操作DOM之前允许页面首先加载是很重要的。

相对于非父div的位置div - 这可能吗？

2 个答案: