animation - 如何使用 Modernizr 检测对即时滚动事件的支持？

Question

我使用 ScrollMagic 在网页的每个部分触发动画。这适用于桌面和移动设备上的某些浏览器。

但是，有些移动浏览器（旧版本的 Safari 和 Chrome（在 ipad 上））在滚动事件完成之前不会播放这些动画。我知道有办法解决这个问题。但是，我想在不受支持时简单地关闭这些动画。

有没有办法用 Modernizr 检测到这一点？还是我必须针对特定的浏览器及其版本？

score 0 · Accepted Answer

您不会检测到视差动画。这不是浏览器功能，而是您可以使用浏览器功能来完成的事情。

在这种情况下，您希望检测是否在滚动期间重新排列页面，或者它是否等到滚动事件触发之后。目前没有检测到这一点，创建一个会很油腻。

我相信您所看到的是scroll在某些浏览器上滚动时事件未触发的结果。我想不出用javascript来模拟这个的方法（触发滚动事件显然只会触发一个scroll事件，所以那里没有任何收获）。因此，我不确定您是否能够准确地检测到这一点。

score 0 · Accepted Answer

我完全同意帕特里克的回答，但想补充一点，您所说的移动版 chrome 和 safari 确实可以立即滚动事件。

您描述的问题与版本 8
之前的所有 iOS 设备有关。在此之前，移动浏览器引擎在滚动时不会触发“真实”滚动事件，但只有在滚动完全停止时才会触发（所以在惯性停止之后） . 甚至 javascript 的执行也被暂停，所以你不能只运行一个循环来检查滚动位置。

长话短说：使用容器进行滚动和requestAnimationFrame.
我发现为 iOS8 之前的设备获取滚动事件的最简单方法是iScroll。

所以回到你原来的问题：如何检测你什么时候甚至需要这些变通方法。
您需要检查您是否使用的是 iOS 7 或更低版本，据我所知，modernizr 无法做到这一点，因为它是一个功能检测库。

因此，请查看此线程以了解更多信息：Detect iOS version less than 5 with JavaScript

2 回答 2