问webkit溢出滚动触摸与webkit转换冲突

EN

我目前的(hacky)解决方案是这样的：

$container.one 'webkitAnimationEnd', ->
  $container.find('.contents').remove()
  $container.append('.contents')

基本上，我是在动画结束后删除然后重新添加可滚动div的内容。希望有人对此有更好的解决方案。

我遇到了完全相同的问题，只有当我抛弃-webkit-transform并切换到绝对定位时，这个问题才会消失。

这很好，除了绝对定位导致iOS上的糟糕性能和起伏不定的动画，这在iOS 6+中无法通过以前流行的translateZ和translate3D强制硬件加速黑客来解决。

我想出了一个技巧，但它是如此可怕和丑陋，以至于你可能不想再读下去了：

获取我们想要应用-webkit-overflow-scrolling:touch的元素，并将它与我们应用-webkit-transform的元素完全分开。使用z-index操作使滚动元素显示在最初的相同位置，同时保留-webkit-transform以使原始容器(现在是一个空容器)自然地在适当的位置设置动画。在我的例子中，这个技巧做得不够好，因为可滚动的内容会突然出现在动画容器的顶部，而不是随着它一起滑动。