在页面级别检测向左和向右滑动
在页面级别检测向左和向右滑动
我正在处理无障碍性方面的工作。当用户使用语音提示访问电话时，他们使用右滑和左滑来达到元素。我正在尝试在页面级别上检测滑动，这样根据动作和当前活动元素，我就可以动态地遍历。我们如何在JavaScript中检测网页级别的滑动？
我认为这个问题在StackOverflow上已经得到了解答。我认为这个链接会对此有帮助：https://stackoverflow.com/a/23230280/10761768。
简而言之，您可以使用JavaScript来为整个页面或每个元素单独使用touchstart和touchmove事件监听器，并使用x偏移量来识别其移动方向。有一个名为HammerJS的库提供了额外的手势和触摸反应支持。https://hammerjs.github.io/
如何检测滑动已经得到了纯粹的技术答案，我没有什么要补充的。
然而，在谈论可访问性时，你必须记住，VoiceOver用户使用滑动来在页面中导航，那么当它处于活动状态时，你将无法可靠地检测到滑动事件，因为这些滑动事件被VoiceOver吸收了。你无法对此做任何事情。如果VoiceOver处于活动状态，像滑动这样的事件将无法传递到您的页面。
这导致了第二个建议：因为VoiceOver吸收了滑动事件，VO用户将永远无法触发您在滑动上实现的操作。因此，请提供另一种执行相同操作的方式，例如通过链接或按钮（不要使用其他手势！），否则VoiceOver用户将难以使用您的网站。不要使用另一个手势作为替代方案，因为VoiceOver不仅仅会捕捉滑动。
为了更好的可访问性，甚至建议不要使用手势检测，除非您进行了仔细的测试。VoiceOver吸收一定数量的手势，但不是所有手势；Talkback也会吸收手势，但不是所有手势；因此，可能会发生某些手势在Androit上通过而在iOs上没有通过的情况；可能还会发生一些手势在某些上下文中被吸收而在其他上下文中没有被吸收的情况（例如取决于当前聚焦的内容）。结果是不一致性和屏幕阅读器用户的混淆。
对于滑动，您可能是安全的，它永远不会传递。对于其他一些手势，我不敢肯定，所以最好在几个平台上使用几个屏幕阅读器进行测试。