toe.js icon indicating copy to clipboard operation
toe.js copied to clipboard

Make tap/hold distance dynamic

Open fredgalvao opened this issue 12 years ago • 0 comments

I use toe.js in an app that goes for (iPhone/iPad) => 5.0 && (Androids) => 2.2, and with higher screen resolutions/pixel density coming by, the fixed values on both taphold and tap do not give a great experience (tap hit rate) where resolution is very high.

For example, on a Moto G (4.5", 720p) you'll have to move your finger quite a bit to reach the 30 pixel limit for a tap, and so hit rate is okay. However, on a Galaxy S4 (5", 1080p) or on a Nexus 10 (10", 1600p), a 30 pixels movement can be achieved too easily. Sometimes you're not even trying to move your finger on purpose, but yet the touch surface has changed enough for the touch events to have new coordinates.

I've used document.documentElement.clientWidth with a 100% level of compatibility on (iPhone/iPad) => 5.0 && (Androids) => 2.2 to determine the width of the viewport. I believe you could adjust tap and taphold distance (maybe some of the other events too, but I don't use them -> can't talk for them) according to the size of the viewport and screen pixel ratio (window.devicePixelRatio).

More on viewport sizing: http://www.quirksmode.org/mobile/viewports.html#link12 (see side note -> Measured in: CSS pixels, Browser errors: None) and http://www.quirksmode.org/blog/archives/2012/06/devicepixelrati.html

fredgalvao avatar Nov 27 '13 22:11 fredgalvao