ios 捕捉水平触摸移动,同时允许本机垂直滚动

hrirmatl  于 2023-03-14  发布在  iOS
关注(0)|答案(1)|浏览(131)

我试图探索创建一个HTML5交互的可行性,在这个交互中,触摸可以通过运动的初始方向有条件地捕捉。
我们的目标是捕捉和跟踪触摸的运动,如果它最初是在水平方向移动的话,结合一个只垂直滚动的响应页面布局,我们应该能够使用水平滑动来跟踪它,做一些很酷的事情。
问题在于似乎不可能(尤其是在iOS上)有条件地执行触摸序列捕获。
为了追踪触摸(我的意思是具体地获得x,y坐标的流,其表示手指随时间的位置),touchstart必须被preventDefault编辑,以防止页面进行本机动量滚动。(setTimeout、rAF、jQuery animate等),甚至CSS关键帧/动画/过渡执行。
我真的很想知道是否有一种方法可以处理原始touchstart事件的preventDefault()。JS完全有可能存储该事件对象,然后在稍后的时间(当确定我们确实有兴趣阻止本机滚动启动时)才调用它。
但这肯定会失败,因为在该事件上不运行preventDefault()的默认行为是使用native-scroll,这将在整个滚动剩余时间内阻止JS执行。未能返回附加到touchstart的事件侦听器函数似乎不是一个选项,它将冻结所有内容。
因此,在没有任何其他见解的情况下,试探性的答案是,如果我们想要能够捕获所有滑动,那么必须捕获所有滑动,并且滚动必须通过外部手段“伪造”(iScroll)[http://cubiq.org/iscroll-5-ready-for-beta-test](就我个人而言,我希望探索rAF和window.scrollTo的某种组合,如果iScroll 5不使用这些API,我会感到惊讶)
顺便说一句,第4个演示的描述让我非常兴奋,但事实证明,它所做的只是创建一个页面部分,iScroll水平滚动,而页面的其余部分则有规律地运行,这完全是平凡的。

4nkexdtk

4nkexdtk1#

您可以使用touch-action,所有浏览器都支持它的大多数值

相关问题