可靠地使用hammer.js 来获取平移事件，同时仍然在iOS 中自然滚动......？答案

【问题标题】：Reliable use of hammer.js to get pan events while still naturally scrolling in iOS ...?可靠地使用hammer.js 来获取平移事件，同时仍然在iOS 中自然滚动......？
【发布时间】：2015-08-03 05:13:23
【问题描述】：

基本上，我希望能够使用hammer.js 简单地检测任何平移事件（或至少所有pan-x 事件）的开始和结束，同时仍然允许在x 轴上自然溢出滚动.平移识别器上的 touchAction 声明允许它与自然溢出滚动一起在 Android > Chrome 上正常工作，但在 iOS > Safari 上不行（任何 Safari 版本目前不支持触摸操作声明）。

Codepen(debug-mode) 要么 Codepen(normal-mode)

EG。

var hit = document.getElementById('hit');
var text = document.getElementById('text');

var hammer = new Hammer.Manager(hit);
hammer.add(new Hammer.Pan({
  direction: Hammer.DIRECTION_ALL,
  touchAction: 'pan-x'
}));

hammer.on("panstart", function(ev){
  console.log('panstart');
  text.textContent = ev.type +" detected.";
});
hammer.on("panend pancancel", function(ev){
  console.log('panend');
  text.textContent = ev.type +" detected.";
});

是否有可靠的方法来检测平移运动的所有方向（或仅 x），但也允许正常的溢出滚动 x 行为（在 iOS 中）？我尝试将平移识别器切换到垂直，但发现平移启动并不总是/可靠地立即检测到。

【问题讨论】：

标签： html ios safari touch hammer.js

【解决方案1】：

再想一想，也许 Hammer.js 对于这个特定的用例来说太过分了。

通过剥离 Hammer 并简单地使用本机 ontouchstart 和 ontouchend 事件，我设法获得了所需的结果。例如：

aDomObject.addEventListener('touchstart', handlePanStart, false);
aDomObject.addEventListener('touchend', handlePanEnd, false);
aDomObject.addEventListener('touchcancel', handlePanEnd, false);

这样，任何触摸事件的默认操作都会落入默认浏览器行为（在我的情况下 - 溢出！）。

【讨论】：