移动浏览器中touchevent的相对位置

Question

我在获取触摸事件到它发生的html元素的相对位置时遇到了问题。我知道，这个问题可能被问过无数次了。但我为这个问题挣扎了好几天，看了很多解决方案。

奇怪的是，在我测试的所有桌面浏览器上，它都可以工作，但在手机浏览器上却没有。

我测试了桌面

歌剧
Chrome
Firefox

和Mobile

• HTC One X (4.1) Chrome
• Samsung Note 10.1 (4.1) Stock Browser
• Samsung Note 10.1 (4.1) Chrome
• Nexus 7 (4.2) Chrome

这是我的代码。

似乎问题是，如果我的画布捕获事件在滚动区域内，offsetParent元素的scrollTop属性在移动浏览器上设置为0，在桌面浏览器上它具有适当的值。

那么这是一个已知的bug吗?还是我疏忽了什么?更重要的是，是否有一个变通的方法，或其他方法来实现我的目标?

这里是我的一些代码，我是如何计算相对位置的:

getRelativePosition: function (element, event ) {
var position = { x : event.pageX, y : event.pageY };
do {
  this.log(element.offsetTop);
  this.log(element.offsetHeight);

  position.x -= element.offsetLeft;
  position.y -= element.offsetTop;
  position.x += element.scrollLeft;
  position.y += element.scrollTop;
} while(element = element.offsetParent);
return position;
}

Answer 1

这个问题可能是因为Enyo在某些平台上使用CSS 3D变换来改进滚动。在核心中加入了一个新的效用函数getAbsoluteBounds来计算相对位置。

你可以检查一下它是否处理了你的情况。粗略地看一下，我不确定它和你的有什么不同。如果没有，您可能需要在它上面提交Jira。