jQueryCSS在元素下方放置一个div

我有：

#底部div{
z指数：999
}
将Div放置在输入框下方
内容检测

内容检测

内容检测

$（“#底部div”）.hide（）
$（“#主”）。单击（函数（）{
$（“#底部div”）.toggle（）；
});

我希望

底部div

位于输入框下方，并且应该位于内容上方，即没有内容应该阻止它。如何使用CSS和jQuery实现这一点

编辑：我希望它像自动完成一样。

只需删除

$（“#底部div”）.hide（）

在脚本中添加一个



在输入之后

您可以将输入像

<div><input type="text" /></div>
<div>you content</div>


你满意吗

或在输入标记后添加


就像你在自动完成中得到了div一样

好的，我知道你现在想要什么了

只需添加
位置：绝对
并确保为其提供背景，以便其下方的内容不会显示出来

#bottom-div {
    z-index:999;
    position:absolute;
    background:#fff;
}

演示：
虽然这是一个非常古老的问题，可能对提问者没有帮助，但对其他也在搜索相同问题的人也有帮助

您需要通过以下方式获取输入的位置和高度：
var pos=$（this.position（）；
var height1=$（this.outerHeight（）

然后将div的css编辑到所需的位置，如下所示
$（“#菜单”）.css({
位置：“绝对”，
顶部：（位置顶部+高度1）+“px”，
左：（位置左）+“px”，
}).show（）

不，不，不是这样的。就像你在自动完成中得到了div一样不不，不是这样。就像你在自动完成中得到了div一样哦，是的，这就是我想要的：D但是现在我如何将div的宽度设置为输入框的最大宽度你现在在评论中为你的问题添加了两个额外的请求。如果你想让你的问题完整，把你需要的一切都说清楚，我会再看一看。因为当我把这个：$（“#bottom div”）.width（$（“#main”）.width（）；它仍然比输入域更大。别介意，我弄明白了它为什么这么大
#bottom-div {
    z-index:999;
    position:absolute;
    background:#fff;
}

js fiddle link:`http://jsfiddle.net/m78u8805/`