本机滚动延迟或停止iOS上的JavaScript执行

时间:2014-03-18 16:20:15

标签: javascript jquery mobile-safari user-experience

这不是一个特定的JS代码问题,但更多的是iOS处理JS的方式导致我的网站出现比其他大多数问题更多的问题。

仅在iOS上(它不会在Android上发生)如果我本地滚动(向上/向下)然后尝试在滚动完成之前(非常快)激活某些JS然后完全忽略了JS。

我相信Apple会这样做,以便UX始终保持优先权(不要让任何蹩脚的JS减慢用户速度),但在这种情况下,它只是一个非常简单的JS片段,我想允许跑步。

例如,如果用户正在滚动,然后快速按下屏幕顶部的一个选项卡,打开一个固定的导航面板,那么如果仍然发生本机滚动,它将无法注册。如果他们再次按下它(滚动已经完成),那么它就可以了。

我还使用JS滑块水平滚动图像,如果我尝试在本地上/下滚动完成之前向左/向右滚动它有点跳跃并且不是很好的用户体验。我认为它优先考虑原生卷轴,但仍然会以某种延迟激活水平卷轴。

这不是一个大问题,但并不完美。如果每个人都慢慢浏览网站并等待原生卷轴完全停止,那就太棒了。但当然人们不会这样做。

我不认为防止默认行为会做任何事情。我曾尝试在iOS之前接管原生卷轴,但我认为你不能。

我认为这可能实际上发生在许多网站上。我刚试图通过在iPhone上访问stackoverflow.com找到一个很好的例子,如果你快速滚动然后在滚动完成之前快速点击一个链接就不会注册。我不认为文本链接是一个很大的用户体验问题,但是一个水平的滑块和大的打开菜单'在原生卷轴结束之前,顶部的按钮更有可能被快速击中(因为在按下之前你不需要阅读某些东西,比如文字链接)。

我在网站上有各种各样的JS脚本,这些脚本会受益于iOS中的改进,所以如果我能理解它的方法,为什么会发生,发生了什么,那么我可以对每个脚本应用单独的修复脚本。

感谢。

1 个答案:

答案 0 :(得分:3)

问题不在于iOS在滚动时忽略了javascript(更确切地说,当滚动动量处于活动状态时)。问题在于,虽然发生了这种情况,iOS并没有真正注册屏幕上元素的位置变化。事实上,如果你有一个附加到scroll事件的处理程序,它会在你停止触摸屏幕的那一刻停止发射,然后在滚动停止时只发射一次。

后果?你认为你正在触摸一个链接,但你不是。屏幕上的图像向上或向下移动,但是,对于broswer,一切都在同一个位置,所以,实际上,你没有触摸任何东西(或触摸不同的东西)。当我发现这种行为时,我非常恼火,因为在我的情况下,我的页面中充满了链接到图库的图像...如果您在滚动时触摸它们,则图库会打开,向您显示您触摸的图像,但是另一个(当你的手指停止触摸屏幕时,真正在那个位置的那个)。

有解决方法吗?我所知道的唯一一个是禁用滚动动量,但是你失去了滚动性能。