Question

我试图设置元素相对于父元素的偏移量（顶部和左侧）。

我有一个位置相对的容器和我必须以绝对值显示的元素。如何设置绝对元素的顶部和左侧？偏移设置与文档相关的顶部和左侧，我不需要它。

提前致谢！

编辑：这是我的代码：

var styles = {
        width: 200,
        height: 200,
        position: 'absolute',
        top: 10,
        left: 20
    };
$imgScaledCircle.attr('src', pathimg).css(styles).addClass('active');

它设定了所有预期的上下左右。我不明白为什么。

Answer 1

您可以这样使用：

$(child).each(function () {
  $(this).css({
    top: $(this).parent().offset().top + 5,
    left: $(this).parent().offset().left + 5
  });
});

这里child是子元素的选择器。您可以将硬编码的5替换为您要替换的位置。

Answer 2

position:absolute的n元素使用相对于您找到的第一个容器的坐标向上移动位置为absolute或relative的父链。在此搜索过程中，不会考虑具有默认position属性（static）的元素。

要将元素放置在位于容器内给定像素的容器内，应使用position: relative声明容器本身，使其left和top保持默认状态。

.container { position: relative; }
.element { position: absolute;
           left: 100px;
           top: 30px; }

Answer 3

我理解为什么我的代码不起作用。我正在将值存储在变量中：

var coord = $that.attr('coords').split(','); var styles = { position: 'absolute', top: coord[1], left: coord[0] };

它没有用。也许是因为split方法返回一个字符串而不是一个数字。如果我写这个（强制变量为数字）：

var coord = $that.attr('coords').split(','); var styles = { position: 'absolute', top: (coord[1] >>> 0), left: (coord[0] >>> 0) };

正确添加样式。谢谢你的帮助。

使用jQuery相对于父级设置元素的偏移量

3 个答案: