CSS3 Ken Burn 效果在页面滚动时暂停，然后再次播放以获得流畅的动画效果

Question

在社区中其他人的帮助下，我已经构建了一个 CSS3 Ken Burn 效果。在我们切换到翻译动画之前，它一直很不稳定。现在很顺利。

http://jsfiddle.net/gxUhH/52/

现在的问题是，当页面在触摸屏设备上滚动时，它会变得不稳定。据推测，这是因为需要额外的处理能力。

我认为解决方案是在滚动时暂停动画，然后在滚动完成后再次播放。我不知道如何做到这一点。我也很乐意听到有关此事的任何其他建议。

上面的 fiddle 将向您展示它的所有功能。目前仅限 WebKit。

有什么想法吗？

很棒

Answer 1

我遇到了一些闪烁和抖动的动画问题，这个位修复了它:

-webkit-perspective: 1000;
-webkit-backface-visibility: hidden;