捕捉水平触摸移动,同时允许原生垂直滚动

时间:2013-09-28 05:00:03

标签: javascript android ios html5 javascript-events

我正在尝试探索创建HTML5交互的可行性,其中可以通过运动的初始方向有条件地捕获触摸。

如果最初在水平方向上移动,目标是捕捉和跟踪触摸的运动。结合仅垂直滚动的响应式页面布局,我们应该能够使用水平滑动动作通过跟踪来做一些很酷的事情。

问题在于似乎不可能(特别是在iOS上)有条件地执行触摸序列捕获

为了跟踪触摸(我的意思是特别是获得表示手指随时间的位置的x,y坐标流),touchstart必须preventDefault为了防止页面使用原生动量滚动。原生动量 - 滚动,在运行时,暂停所有JS执行(setTimeout,rAF,jQuery animate等...)甚至CSS关键帧/动画/转换执行。

我真的想知道是否有办法以某种方式调整原始preventDefault()事件的touchstart。 JS完全可以存储该事件对象,然后直到稍后(当确定我们确实对防止本机滚动启动感兴趣时)才调用它。

但是肯定会失败,因为在该事件上没有运行preventDefault()的默认行为是使用本机滚动,然后在滚动的整个剩余持续时间内阻止JS执行。未能返回附加到touchstart的事件侦听器函数似乎不是一个选项。它会冻结一切。

然后,没有任何额外见解的暂定答案是,如果我们想要能够捕获所有滑动,必须捕获所有滑动,并且滚动必须通过外部手段(iScroll)进行“伪造”[ http://cubiq.org/iscroll-5-ready-for-beta-test](就我个人而言,我想探索rAF和window.scrollTo的某种组合,如果iScroll 5没有聘用,我会感到惊讶这些API)

顺便说一下,第四个演示的描述让我非常兴奋,但事实证明它所做的只是创建一个页面部分,iScrolls水平展开,而页面的其余部分定期运行,这是完全平凡的。

0 个答案:

没有答案