有没有办法修复/重新构建这个jQuery脚本,使它能够消耗更少的内存并运行得更快?(I&x27;m使用1.6.2)

有没有办法修复/重新构建这个jQuery脚本,使它能够消耗更少的内存并运行得更快?(I&x27;m使用1.6.2),jquery,memory,jquery-animate,cpu,dom-manipulation,Jquery,Memory,Jquery Animate,Cpu,Dom Manipulation,我是jQuery新手,我用它制作了一个幻灯片旋转木马,我不知道我是否错过了一些东西,所以请看一下我的脚本: function gotoItem(main, hidden, con, speed, state) { con.css('display', 'none'); switch(state) { case 'next' : main.children(':first').appendTo(hidden).css('left','0px'); hidden.childr

我是jQuery新手,我用它制作了一个幻灯片旋转木马,我不知道我是否错过了一些东西,所以请看一下我的脚本:

function gotoItem(main, hidden, con, speed, state) {
con.css('display', 'none');
switch(state) {
    case 'next' :
    main.children(':first').appendTo(hidden).css('left','0px');
    hidden.children(':first').appendTo(main).css('left', '730px');
    lmove = '-=120px';
    middle = 3;
    end = 6;
    break
    case 'prev' :
    main.children(':last').prependTo(hidden).css('left', '0px');
    hidden.children(':last').prependTo(main).css('left', '-230px');
    lmove = '+=120px';
    middle = 3;
    end = 6;
    break;
}

main.children().each(function(i) {
    if(i==end) {
        $(this).stop().animate({
        left: lmove
        }, speed, function() {
        con.css('display', 'block');
        });
    } else {
        if(i==middle) {
            $(this).stop().animate({
            left: lmove,
            opacity : 1
            }, speed);
        } else {
            $(this).stop().animate({
            left: lmove,
            opacity : 0.3
            }, speed);
        }
    }
    });
}

事实上,代码没有什么问题,但当我发现脚本占用了大量内存(每次函数运行时大约100kb)时,它真的让我很头疼,更不用说cpu上下波动了20-30%(我使用的是单核笔记本电脑,我的浏览器是Chrome 12)。我已经用Firefox对它进行了测试,结果基本相同。那么,有什么建议吗?我应该如何重写脚本,以便它可以更快/更少的内存泄漏?或者我对剧本已经无能为力了?提前感谢您

设置left属性的动画总是占用内存。您可以使用带有
overflow:hidden的覆盖div,然后使用
.scrollLeft()
设置幻灯片动画


这已经把我们带到了另一个点,在那里你可以节省资源。您首先加载内容,然后将其放置在看不见的地方,而不是在浏览器之后必须渲染的项目上添加和预先添加。这显然是一个性能与加载时间的决定,可能对您的总体性能影响不大,但一般来说,如果您针对的是低端机器,则应避免大量的Dom操作。

有趣!我还没有尝试过scrollLeft方法,如果它真的能减少内存消耗,那么我将非常感谢。对于设计师来说,jQuery上的东西是相当折衷的。真值得一试!非常感谢。