touchmove 中的 JavaScript DOM 更改延迟到移动 Safari 上的滚动结束

Question

在 mobile safari 中，在处理元素的 touchmove 过程中，我更改了该元素的 className。不幸的是，视觉变化不会在用户滚动时发生，或者直到惯性滚动结束时才会发生。

我该怎么做才能让 className 立即可视化？

更多:显然，这不仅限于类名更改，似乎还包括对 DOM 的任何更改，例如 innerHTML 和 style。

Answer 1

我实际上建立了那个网站，是的，解决这个限制的方法是不使用内置浏览器功能滚动网站，而是伪造它。 JS 监听滚轮和键盘事件，并将主容器的 css top 属性补间到它自己的“scrollTop”。右侧的滚动条当然是自定义的 JS 滚动条。在这种情况下，它同步到相同的内部“scrollTop”值。

整个站点实际上只是一个大补间，主时间轴位于其 scrollTop 位置，所有子动画都在特定时间触发。 JS 未缩小，因此请查看 ScrollAnimator.js 文件，它就在那里。