search

hammerjs / hammer.js

A javascript library for multi-touch gestures :// You can touch this
http://hammerjs.github.io
MIT License
24.12k stars 2.62k forks source link

Mobile scroll and hammer's 'pancancel' #1254

Closed ExileofAranei closed 4 years ago

ExileofAranei commented 4 years ago

The problem is fired 'pancancel' event on mobile devices. After a small browser threshold before scrolling starts, 'pandown' or 'panup' are fired several times, but then immediately fires 'pancancel' at the same time when scrolling starts. I don't know how to handle it, because i need to do something while user is "dragging" it. (Refer to sandbox) When i start "dragging" it at green background everything is ok, but if i start dragging at inner element with grey background, i need to wait while it is not scrolled to the edge, and then do something. But i can't check for it due to even is element fully scrolled, the 'pancancel' event is still fired. I searched through the issues for something similar, but couldn't find any. Does anybody have an idea how to work around it?

How to reproduce

  1. Open SandBox: https://codesandbox.io/s/heuristic-rgb-rz6bw open it in new window, or just open it directly https://rz6bw.csb.app/
  2. Open DevTools and toggle responsive view
  3. Look at fired events which are logged to console

Some information

OS: Windows 10, version 10.0.18363 Build 18363 Browser: Google Chrome 83.0.4103.97 Hammer.js: 2.0.8

ExileofAranei commented 4 years ago

Solved by adding 'inputClass: Hammer.TouchMouseInput' option. element.hammer = new Hammer(element, { inputClass: Hammer.TouchMouseInput })