1

我想获得画布的 X 和 Y 坐标，为此我使用了这个问题中建议的解决方案。为了便于参考，这是我正在使用的功能（包括一个小的调试警报消息）：

function getCumulativeOffset(obj) {
    var left, top;
    left = top = 0;
    if (obj.offsetParent) {
        do {
            alert("obj id = " + obj.tagName + " (" + obj.id + ")");
            left += obj.offsetLeft;
            top  += obj.offsetTop;
        } while (obj = obj.offsetParent);
    }
    return {
        x : left,
        y : top
    };
};

但是，我没有得到我期望的结果。现在，我将问题归结为 getCumulativeOffset 函数没有在我的 HTML 中获取文章标签。这里是相关的 HTML：

<body>
    <article>
        <canvas id="pizza" width="460" height="460">Your browser does not support the HTML5 canvas.</canvas>
    </article>

    <div id="temp"></div>
</body>

相关的CSS：

article, aside, figure, footer, header, hgroup, nav, section {
    display:block
}
body {
    font: normal medium 'Gill Sans', 'Gill Sans MT', 'Goudy Bookletter 1911', 'Linux Libertine O', 'Liberation Serif', Candara, serif;
    padding: 0;
    margin: 0 auto;
    width: 40em;
    line-height: 1.75;
    word-spacing: 0.1em
}
article {
    text-align: center;
}
#pizza {
    display: inline-block
}

出于某种原因，当我测试该功能时，似乎文章标签不是我所期望的画布的 offsetParent。这是输出：

  • obj id = 画布（披萨）
  • bj id = 身体 ()

谁能解释一下？

4

1 回答 1

1

引用的元素offsetParent是最近定位的祖先元素，如果没有找到，则返回元素有一些规则（offsetParent在 MDN）。在您的情况下，设置应该可以解决position: relative问题。<article>

于 2012-12-25T15:45:14.793 回答