jquery - HTML5 Canvas 触摸事件在 iPad 或移动 safari 浏览器上偏移

Question

我遇到了一个问题，无法通过 Google 解决，这是我在 stackoverlow 上的第一篇文章。我有两个 Canvas 元素堆叠在一起，在我的公司网站上创建彩票类型的刮刮乐功能。问题是，在 Ipad 上，如果我向下滚动页面，即使滚动一个像素，触摸位置也会偏离等于滚动的高度。我尝试了几种不同的方法来尝试解决此偏移问题，但均无济于事。

使用的JS库:Jquery1.6.4和kinetic2d1.0.2 http://www.kineticjs.com/用于移动触摸事件检测。

我没有经常使用 Safari Mobile，所以我认为有一些属性或方法可以确定我不知道的偏移量。

我想要一个 JS 解决方案来解决这个问题，但是任何能让我到达终点线的 hack 都会获胜。

提前致谢。

Answer 1

这里没有 iPad 来测试它，但你看过 jQuery Offset ？您可以使用它来获取 Canvas 元素相对于浏览器窗口的坐标，然后在计算中进行补偿，如下所示:

offset = $('#myCanvas').offset();
left = pageX - offset.left;
top = pageY - offset.top;