Jquery CPU使用率

Question

我正在使用Jquery使图像水平滚动到我的页面.唯一的问题是它使用了大量的cpu使用.在Firefox中的单核笔记本电脑上高达100%.什么可能导致这???

jQuery的

<script>
    jQuery(document).ready(function() {

    $(".speech").animate({backgroundPosition: "-6000px 0px"}, 400000, null);
    });

    </script>

CSS

.speech {
    /*position:fixed;*/
    top:0;
    left:0px;
    height:400px;
    width:100%;
    z-index:-1;
    background:url(/images/speech.png) -300px -500px repeat-x;
    margin-right: auto;
    margin-left: auto;
    position: fixed;
}

HTML

<div class="speech"></div>

Answer 1

它占用了CPU资源,因为您要求浏览器在很长一段时间内每秒多次重新绘制图像.这不是免费的.

Answer 2

如果有人在使用jQuery动画时(正如我所知)寻找高CPU使用率的解决方案,那么值得注意的是jQuery.fx.interval被添加到jQuery 1.4.3中,因此您可以控制动画间隔率.

使用示例(将其设置为大约50-70使我的动画保持平滑,我注意到CPU使用率下降到大约10-20%):

jQuery.fx.interval = 50;