触摸移动和桌面上的坐标

Question

我正在尝试创建一个可以在桌面和移动设备上运行的差异游戏，并且在使用移动设备时找到玩家触摸的图像上的坐标时遇到问题。

游戏在手机上流畅，因此图像会自动调整大小以填充可用屏幕。

我正在使用此代码检测鼠标位置：

$(document).on("click",".image-wrapper",function(e){
  var coordX = e.pageX - $(this).offset().left;
  var coordY = e.pageY - $(this).offset().top;
  alert (coordX + ', ' + coordY);
}

该代码在桌面上运行良好，但是当我在移动设备上试用时，它会产生不同的结果。

图像尺寸为368像素x 550像素。

如果我触摸顶部的图像，我看到的坐标与桌面相同。

但是，如果我触摸图像的一半，垂直坐标显示比桌面大约60像素，如果我触摸图像的底部，垂直坐标显示比桌面大约120像素。

有没有办法在所有设备上获得可靠的坐标？

我的观点差异游戏将毫无用处:(