javascript - 使用 jquery 将 div 设置为页面顶部的动画，但它在 Chrome 中闪烁

Question

我正在使用 jquery 将 div 设置为页面顶部的动画，但由于某种原因，在 chrome 中查看它时它会闪烁非常糟糕。这是我的意思的一个过于简化的版本。有什么办法可以避免这种闪烁？

http://jsfiddle.net/WzhY9/

Answer 1

我运行了您提供的示例，它对我来说没有闪烁，但是作为建议，您可以在 load_bar 元素上强制硬件加速。

#load_bar { 
    height:10px; 
    position:absolute;
    background:black; 
    right: 0; 
    top: 400px; 
    width: 300px;

    /* Force hardware acceleration */
    -webkit-transform: translate3d(0, 0, 0);
    -webkit-backface-visibility: hidden;
    -webkit-perspective: 1000;

}

请注意，这仅适用于 webkit 浏览器（因为 -webkit- 前缀），您可以添加其他浏览器以支持其他浏览器。

我希望这有帮助。