检测移动浏览器捏缩放 [英] Detect mobile browser pinch zoom
问题描述
我想知道是否有办法检测用户正在进行捏缩放。
I want to know if there is a way to detect user is doing pinch zoom.
- 让div对齐屏幕的左侧
- 将div的宽度设置为等于视口宽度
我发现Android有 touchstart
, touchend
和 touchmove
,但多点触控时不会触发它们。我想在完成缩放后立即完成上述功能。
I found Android has touchstart
, touchend
and touchmove
, but they won't be triggered during multitouch. I want to complete above function right after finishing zooming.
还有其他方法吗?
我不是做网络应用程序。我只是在移动版中添加了一些功能。
I am not doing the web app. I am just adding some functions to the mobile version.
推荐答案
Android浏览器支持 touchstart
, touchend
&使用JavaScript的 touchmove
,但旧版机器人的问题是这些事件检测到的触摸次数。
Android browser supports touchstart
, touchend
& touchmove
with JavaScript, but the problem with older androids is the number of touches these events are detecting.
例如,此代码将在IOS和更新的Android设备上记录消息:
For example, this code will log the message on IOS and on newer android devices:
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
。
Older androids will do nothing because event.targetTouches.length
will never be equal to 2
.
恕我直言,您应该使用这种方法来支持大多数设备并为旧设备提供后备选项(使用其他手势进行缩放,如双击或缩放按钮)。
IMHO, you should use this approach that will support most devices and provide a fallback option for older devices (use other gestures for zooming like double tap or a button to zoom).
这篇关于检测移动浏览器捏缩放的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!