jQuery 职位答案

【问题标题】：jQuery positionsjQuery 职位
【发布时间】：2011-10-27 09:01:59
【问题描述】：

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

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

我设置：

问题是：我跑的时候

为什么会有这么多不同，我需要使用 jQuery 以编程方式访问图像。谁能向我解释一下，以及如何修复它以提供图像的确切位置。

这里又是链接：my page circles

提前感谢您的帮助，

问候，

【问题讨论】：

【解决方案1】：

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

如果你想得到你使用的实际 CSS 值，尝试使用：

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

夏。

【讨论】：

【解决方案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 时，它会为您提供正确的像素。

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

【讨论】：

我需要 jQuery 的帮助，在将圆圈设置到正确的位置后，我想要一些插件或命令来让 jQuery 将圆圈返回到它们设置的位置，例如。如果用户将 b1 从它的位置移动到另一个位置，b1 将缓慢返回到它的原始位置。
将还原选项添加到您的可拖动对象。您可以使用 revertDuration 设置速度。 .draggable({ revert: true, revertDuration: 1000 });

【解决方案3】：

您正在获取跨度的位置，这不是块元素。您想获取图像在跨度内的位置：

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

【讨论】：

我想使用 jQuery 将圆圈的位置设置为样式中的样式怎么做？如果我运行你输入的代码，我很困惑，它给了我 442，如果我运行 $('span#b1 img').position().top 我得到 -40

【解决方案4】：

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

【讨论】：