我正在对背景图像（向左缓慢滑动的空间视图）进行非常缓慢的过渡。我的问题是，虽然它在Firefox上看起来很漂亮，但在Chrome上看起来很糟糕。由于Chrome缺乏子像素渲染，我得到了"抖动"效果，并且图像只是捕捉到下一个像素。我无法加快图像速度，因为它会破坏我试图达到的效果。我尝试过使用TranslateZ()技巧，我尝试了我能想到的所有CSS3效果，以使其看起来更好，我尝试了Kinetic.js，我甚至尝试了Babylon.js希望WebGL能解决我的问题。
在这一点上，我不知所措，我可能只需要给Chrome用户一个静态的背景，并更多地迎合Firefox用户，我可以为UI UX做的整洁的小事情，然后只是在我的网站上放一个免责声明，说该页面最好在FF中查看。
我真的不想这样做。有什么解决方法吗？
您可以通过应用小的转换来强制子像素渲染：
#container {
transform: rotate(-0.0000000001deg);
-webkit-transform: rotate(-0.0000000001deg);
}
但是，与其使用JS使动画工作，为什么不使用CSS3动画呢？如果您使用transform: translate()浏览器将默认使用亚像素渲染。
此外，由于性能更好，因此您不应该获得抖动/波浪运动。
有关性能的更多信息，请访问：http://www.paulirish.com/2012/why-moving-elements-with-translate-is-better-than-posabs-topleft/
我在这里整理了一个简单的演示：http://jsfiddle.net/yrwA9/6/（为了简单起见，我只使用了 -webkit- 供应商前缀）