Javascript 负顶部使高度加倍?

Javascript 负顶部使高度加倍?,javascript,jquery,css,Javascript,Jquery,Css,我正在尝试使用负顶部设置下拉动画,动画进行得很顺利,但下面的下一个元素也在向下移动 单击此链接查看示例 当绿色div将鼠标移到事件上时,红色div将其高度增加到50px,顶部属性将下降-49px,因此红色div看起来像是下拉菜单 但是我认为绿队,没有被碰过,应该留在这个位置上。 在我的示例中,绿色div向下移动的幅度与红色div增加的高度相同 那么,绿色部门发生了什么?这有点像红色的div是原来增加高度的两倍,然后按下绿色的div 注意:我已经尝试通过使用负属性设置绿色div的动画来修复它。它

我正在尝试使用负顶部设置下拉动画,动画进行得很顺利,但下面的下一个元素也在向下移动

单击此链接查看示例

当绿色div将鼠标移到事件上时,红色div将其高度增加到50px,顶部属性将下降-49px,因此红色div看起来像是下拉菜单

但是我认为绿队,没有被碰过,应该留在这个位置上。 在我的示例中,绿色div向下移动的幅度与红色div增加的高度相同

那么,绿色部门发生了什么?这有点像红色的div是原来增加高度的两倍,然后按下绿色的div

注意:我已经尝试通过使用负属性设置绿色div的动画来修复它。它看起来不错,但当我将光标疯狂地悬停在green div上时,有时green div会上下移动(垂直摇晃)约1px

请照亮我


thx

将容器设置为
position:relative
,并将可调整大小的div设置为
position:absolute

演示