jquery – 如何在加载后在绝对定位的元素周围附加边距或填充？

2024年1月31日 180次阅读

所以基本上我有这样的布局：

<div id="header">
   <div id="elementAbsolute">
   <div id="headerElement1">
   <div id="headerElement2">
</div>

<div id="content">
etc etc

我的问题是div id“elementAbsolute”可以在页面上随机打开或关闭.我无法控制.当它打开时,它需要出现在标题下面但在内容之前.由于它绝对定位,它只是出现在内容上.它显然不会在其上方或下方创建任何垂直空白.

在此特定模板中,必须在标记中的位置调用该元素.它无法移动.有没有办法,可能通过javascript,说如果“elementAbsolute”打开并存在于“header”div内的页面上,然后在标题和内容div之间移动它并创建一些空格？

另请注意,此模板用于多个站点,因此只有在“header”中存在“elementAbsolute”时才能添加空格.

我正在考虑使用jQuery after()函数在它之前和之后放置一个空div来创建该空间,但后来我的问题变成了我只想在页面上有“elementAbsolute”的情况下运行此函数,否则无论怎样,我都会在那里有空白.

谢谢你的帮助！

最佳答案 如果elementAbsolute具有固定高度,那么一个简单的修复就是将空白添加到headerElement 1或2而不是

#elementAbsolute + #headerElement1 + #headerElement2
{
  margin-bottom: 50; /* Size of absolute element /*
}
点赞