Question

我有一个我无法理解的问题，请帮忙：

我已经开发了带有图像的html页面，并使用jQuery UI帮助将它们拖放，我将这些图像位置设置为相对位置并给出了左上角像素，这里是页面的链接http://ayyashsigns.com/lab/circles.html

我设置：

问题是：我跑步时

为什么这一切都有所不同，我需要使用jQuery以编程方式访问图像。任何人都可以向我解释这个问题，以及如何修复它以给出图像的确切位置。

以下是链接：my page circles

Thanx提前获得任何帮助，

此致

Answer 1

“。position（）方法允许我们检索元素相对于偏移父元素的当前位置。”

如果您想获得您使用的实际CSS值，请尝试使用：

$('span#b1').css('top');

晒。

Answer 2

将<p id="monitor">更改为<div id="monitor">，并记住也要更改</p>。

将其添加到样式表中：

body {
    margin: 0;
}

#content {
    position:relative;
}

#b1 {
    top: ##px;
    left: ##px;
    position:absolute;
}

对所有圈子使用position：absolute，找到正确的顶部和左侧px。它应该从屏幕的左上角开始top:0px; left: 0px;

现在，当您使用$('span#b1').position().top时，它会为您提供正确的px。

仅供参考，.position将返回相对于父级的px，.offset将返回相对于文档的px。

Answer 3

您正在获取跨度的位置，该位置不是块元素。您希望在范围内获取图像的位置：

$('span#b1 img').offset().top

Answer 4

我认为在这种情况下，最好在每个圈子中使用position:absolute;，并在position:relative上保留#content。这样，您就可以使用position().top和position().left获得正确的价值。