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

在mobile safari中，在处理元素的

touchmove

过程中，我更改了该元素的

className

。不幸的是，当用户滚动时，或者直到惯性滚动结束时，视觉变化才发生

如何使

类名

立即可视化

---

更多：显然，这不仅限于类名更改，而且似乎是对DOM的任何更改，例如

innerHTML

和

style

不幸的是，这是设计造成的。iOS safari将对所有DOM操作进行排队，直到滚动或手势结束。实际上，DOM在滚动期间被冻结

我想我可以在apple开发者页面上找到这方面的参考，但我只能找到jQueryMobile的链接：

请注意，iOS设备在滚动、排队期间冻结DOM操作 当滚动结束时应用这些选项。我们正在调查 允许在滚动开始前应用DOM操作的方法

---

希望这有帮助

我实际上构建了该网站，是的，绕过此限制的方法是不使用内置浏览器功能滚动该网站，而是伪造它。JS侦听滚轮和键盘事件，并将主容器的css top属性连接到自己的“scrollTop”。右边的滚动条当然是自定义的JS滚动条。在这种情况下，其同步到相同的内部“scrollTop”值

---

整个站点实际上只是一个大的tween，主时间线是它的滚动顶端位置，所有的子动画都在特定的时间触发。JS没有缩小，所以请查看ScrollAnimator.JS文件，它都在那里。

只需将位置更改为

-webkit sticky

。不要设置top，这样它看起来就像一个普通元素，但执行起来像一个固定元素。您可以立即更新其样式（位置除外）

经过深思熟虑，我猜这是如此沉重的DOM操作并没有减缓滚动的可爱惯性。悲伤。我试得越多，情况就越清楚。不知何故，这个网站克服了这个限制。有人知道他们做了什么吗？效果很好！我可能错了，但看起来他们正在覆盖滚动（在ScrollAnimator.js中的touchMoveHandler方法中，他们使用的是event.preventDefault），而只是将可视区域设置为滚动正在发生的动画。可能是错的，只看几分钟，但看起来是这样的！：）有点晚了，但在移动设备（ipad）上这样好吗？有人能提供链接吗？在Mac/Firefox上用两个手指在触摸板上滚动时，页面没有滚动，上面的链接似乎断了。有人可以发布示例代码吗？如果在链接消失之前包含ScrollAnimator.js的代码就好了。。。这就是你们要找的吗？这在iOS和更新版本的桌面safari中运行良好。我对头所做的是专门为iOS做的，我使用这个属性，其他一切都使用固定的，这是因为兼容性。更多关于这个属性的信息：这个！难以置信的几天来，我一直在努力寻找解决办法，在触摸移动和定位过程中为某些东西设置动画：粘性；这正是我需要的。我自己永远也不会想到这个。非常感谢你！