Question

我需要减慢for循环的执行速度。我必须慢慢增加div的宽度。

到目前为止，我已经尝试delay(),setTimeout(),setInterval()，但没有成功。他们似乎都表现得一样。

HTML

<body>
   <h1>Hello</h1>
    <div class="divclass">

    </div>
</body>

的jQuery

$(document).ready(function () {
    var width = $('.divclass').width();
    for (var i = 0; i < 6; i++) {
        width = width + 20;
        $('.divclass').delay(2000);
        $(".divclass").css("width", width);
    };
});

http://jsfiddle.net/RQVa8/1/

任何人都可以告诉我我的错误所在。

提前致谢。

Answer 1

DEMO

.animate()文档

$(".divclass").animate({width: width}, 2000);

Answer 2

使用jQuery animate。

$(".divclass").animate({ "width": "+=20" }, 2000);

请参阅有关+=使用相对值的部分：

动画属性也可以是相对的。如果提供了一个值一个前导+=或-=字符序列，然后是目标值通过从当前加上或减去给定数字来计算财产的价值。

减慢for循环的速度

2 个答案: