Question

我很难解决这个问题。我有一个孩子，父母和祖父母元素。我想知道相对于祖父母的子偏移位置（位置：绝对）但是这是一个棘手的部分，父母必须处于相对位置，因为是折叠，所以当折叠时，子元素也会崩溃。我不能离开父母没有位置相对其他明智的绝对孩子不会崩溃并留在原地。

我目前可以在Jquery

中获取与父级相关的子位置

// simple accordion
$('.accordion').on('click',function(){
  $(this).next().slideToggle();
})
// get child offset
var childPos = $('.child').position();
console.log(childPos.top) // top position from granparent

CSS

.grandparent{
  position:relative;
}
.parent{
  position: relative;
  padding:20px;
}
.child{
 position: absolute
}

HTML

<div class="grandparent">
  <div class="parent">
    <div class="accordion">accordion</div>
    <div class="child">
      child content
    </div>
  </div>
  <div class="parent">
    <div class="accordion">accordion</div>
    <div class="child">
      child content
    </div>
  </div>
  <div class="parent">
    <div class="accordion">accordion</div>
    <div class="child">
      child content
    </div>
  </div>
</div>

请帮忙！

Answer 1

如果我理解正确，你应该能够重复你父母在父母中的位置的策略。

var childPos = $('.child').position();
console.log(childPos.top) // top position of child from parent
var parentPos = $('.parent').position();
console.log(parentPos.top) // top position of parent from grandparent
var childGrandparentPosTop = childPos.top + parentPos.top;
console.log(childGrandparentPosTop); // top position of child from grandparent

从祖父母那里获取子元素偏移位置

1 个答案: