I am somehow stucked with this: I am trying to offer the same experience on desktop for some scrolling contents inside of a div like the scrolling on mobile devices. On mobile I am using -webkit-overflow-scrolling: touch; and that is fine. After experimenting with a few libraries, I stumbled across hammer.js and the hamme.js touch emulator.
The question is: how could I use the emulator to touch drag on a container with -webkit-overflow-scrolling: touch; ? I have built a little Hype project. The script seems to work – at least I am getting some log events while I am dragging with the mouse over the div but the content is not scrolling…
It looks like the touch-emulators only goal is to be able to send touch events. You are getting those in your document correctly. It doesn't specifically changes behavior or emulates scrolling; that is up to you to do manually or using Hammer.js.
I'm a little uncertain on what you mean by "overscroll." You could generally override the overflow and set specific properties for overflow-x and overflow-y. For iOS you may need to override touchmove and do something fancier there to only allow scrolling in one direction. (Also note you may need/want to change the viewport settings in the Document Inspector).
Thanks @jonathan! Regarding my side question: I have a fixed size full screen hype scene. If I am touch-dragging somewhere in my scene, the complete scene will move (and than snap-back) in the y direction (something like over-drag). I am pretty sure that I did something in the past to prevent this, but I can’t remember what it was This is happening in Mobile Safari and in Hype Reflect…