检测移动浏览器捏缩放

Question

我想知道是否有办法检测用户正在进行捏缩放。

我想在用户放大时做两件事：

1. 让div对齐屏幕的左侧
2. 将div的宽度设置为等于视口宽度

我发现Android有touchstart，touchend和touchmove，但在多点触控期间不会触发它们。我想在完成缩放后立即完成上述功能。

还有其他方法吗？

---

我不是在做网络应用。我只是在移动版本中添加了一些功能。

Answer 1

Android有一个ScaleGestureDetector。这是一个example。但是，如果您需要额外的多点触控支持，例如轮换，我建议使用this库。我亲自使用它（存储和检索多个图像的转换矩阵），并发现它是一个很好的资源。

Answer 2

Android浏览器支持touchstart，touchend＆amp; touchmove使用JavaScript，但旧版机器人的问题是这些事件检测到的触摸次数。

例如，此代码将在IOS和较新的Android设备上记录消息：

var obj = document.getElementById('elmId');
obj.addEventListener('touchmove', function(event) {
  if (event.targetTouches.length == 2) {
    console.log("exactly 2 fingers gesture inside elmId ");
  }
}, false);

较旧的机器人不会做任何事情，因为event.targetTouches.length永远不会等于2。

恕我直言，您应该使用这种方法来支持大多数设备并为旧设备提供后备选项（使用其他手势进行缩放，如双击或缩放按钮）。