gpt4 book ai didi

javascript - 为什么 offsetParent 忽略我的文章标签?

转载 作者:行者123 更新时间:2023-11-28 02:31:48 24 4
gpt4 key购买 nike

我想获取 Canvas 的 X 和 Y 坐标,为此我使用 this question 中建议的解决方案。 。为了方便引用,这是我正在使用的函数(包括一些调试警报消息):

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
}

由于某种原因,当我测试该函数时,文章标签似乎不是我所期望的 Canvas 的 offsetParent。这是输出:

  • obj id = CANVAS(披萨)
  • bj id = BODY ()

谁能解释一下吗?

最佳答案

offsetParent 引用的元素是最近的定位祖先元素,如果没有找到任何元素,则返回哪个元素有一些规则(MDN 中的 offsetParent )。设置position: relative对于<article>应该适合你的情况。

关于javascript - 为什么 offsetParent 忽略我的文章标签?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14031841/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com