Fixed元素在滚动时会抖动----开启硬件加速

原文：http://stackoverflow.com/questions/11258877/fixed-element-disappears-in-chrome/18764086#

Add -webkit-transform: translateZ(0) to the position: fixed element. This forces Chrome to use hardware acceleration to continuously paint the fixed element and avoid this bizarre behavior.

I created a Chrome bug for this https://code.google.com/p/chromium/issues/detail?id=288747. Please star it so this can get some attention.

 

也就是为样式添加translateZ(0)属性强制开启硬件加速，为了兼容各个平台，需要写成

.test{
    position:fixed;
    -webkit-transform: translateZ(0);
    -moz-transform: translateZ(0);
    -ms-transform: translateZ(0);
    -o-transform: translateZ(0);
    transform: translateZ(0);
}