我有两个div一个在另一个之上。第二个绝对位于它下面(相对div内的绝对div)。
我想将第二个div移到另一个div的顶部,所以它出现在中间。
这个过程是将DIV2的style.top设置为与DIV1相同,理论上应该将它放在它上面。然而到目前为止,尝试都失败了。
绝对定位工作正常,因为输入值会正确移动它,但我认为我使用错误的方法来获取DIV1的高度/最高值。
想法?
我试过了:
divLoading.style.top = divContent.style.top;
但它保持原样。
编辑:问题不在于绝对/相对如何工作,而是使用哪些javascript值正确。使用DIV2.style.top = DIV2.style.top - DIV1.clientHeight将其移动到顶部...但是clientHeight不正确,因为如果DIV1改变大小,它会使DIV2向上移动太远。
编辑:offsetTop似乎为零。
答案 0 :(得分:1)
绝对定位的div位于相对定位的div中,默认情况下“借用”它从相对父级的顶部和左侧位置。这意味着通过设置left:0; top:0
,div将共享相同的位置。
如果你想移动第二个div,你必须设置一个负顶部(即top: -200px
)。顶部和左侧属性是相对于基本位置而不是主体(除非div不在相对定位的父级中,在这种情况下,主体是基本位置)
答案 1 :(得分:0)
如果div1位于相对位置,则顶部和左侧值将相对于正常流程中的div移动div。所以style.top = 10会将它从正常位置向下移动10个像素。
如果位置是“绝对的”,则style.top = 10会将div从相对于它所定位的div向下移动10个像素(即,具有位置的前一个元素:相对的,或者文件)