如何根据元素的父元素设置元素的位置

Question

喜 我有一个div只包含这样的图像：

(div)
    (img. …)
(/div)

现在，我想在图像中创建一个标记，我使用：

$(div).append((img src =mark.jpg id =mark)).

然后设定其位置：

$(div img#mark).position(…)

这里我不知道如何设置它。

我只是想让标记在其父级中的位置。

事实上，我想要谷歌地图，当您在谷歌地图中搜索某些内容时，结果将在地图中标记。

当然，我的要求很简单。

我曾想过得到父母的偏移，然后计算出标记图像的真实位置。

但我做不到。有什么想法吗？

是的，我在手机里问这个，所以我不能做出漂亮的格式。

Answer 1

你可以使用CSS：

div { position: relative; }
div img#mark { position:absolute; }

然后设置这样的位置：

$("div img#mark").css({
    'top': '10px',
    'left': '10px'
});

那是否符合您的意思？

Answer 2

$("div").css('position', 'relative');
$("div img#mark").css({
    position: 'absolute',
    top: '0px',
    left: '0px'
});

更改顶部和左侧值以适合您想要放置标记的位置。

Answer 3

我认为你不需要jQuery来做到这一点：

div {
  position: relative;
}

img#mark {
  position: absolute;
  top: 10px;
  left: 10px;
}

这样，img #mark将相对于div的位置定位：

+---------------
| div
|    ___________
|   | img#mark
|   |
|   |
|    -----------
|
+---------------

Answer 4

如果我没有正确读到你，那么普通的css应该可以达到预期的效果：

#container {
  position:relative;
}
#mark {
  position:absolute;
  left: [to your liking] px;
  top: [to your liking] px;
}

PS：哦，好吧，只有3个人打败了我。