jQuery animate()在setTimeout()循环后失败

jQuery animate() fail after setTimeout() loop

本文关键字：失败 循环 animate jQuery setTimeout      更新时间：2023-09-26

我正在写这段代码(我简化了它)

function flip(i) {
    setTimeout(function() {
        $("#block-"+i).css("transform","rotateY(10deg)");
    }, i*200);
}
$("#flip").click(function() {
    for (i=1;i<=6;i++) {
        flip(i);
        $("#block-"+i).delay(i*200+1400).animate({left:100},500);
    }
    $("#text-1").delay(3000).animate({top:200},4000,"swing",function(){
        $("#block-1").animate({top:500},1000);
    });
});

我知道在循环中使用setTimeout()有一些问题，但问题是在线

$ (" # 1 ") .animate ({: 500}, 1000);

它不动画…当我尝试从回调中取出它时，像这样

function flip(i) {
    setTimeout(function() {
        $("#block-"+i).css("transform","rotateY(10deg)");
    }, i*200);
}
$("#flip").click(function() {
    for (i=1;i<=6;i++) {
        flip(i);
        $("#block-"+i).delay(i*200+1400).animate({left:100},500);
    }
    $("#text-1").delay(3000).animate({top:200},4000);
    $("#block-1").delay(7000).animate({top:500},1000);
});

我不能再工作了，但是我必须添加delay()实际的代码包含一些排队的动画元素，所以我必须计算每个延迟，这很烦人。有什么办法解决这个问题吗?

啊哈。算了吧……我重写了代码，修复了问题，但仍然不知道之前出了什么问题…实际上，新代码还有另一个问题…但那是另一个话题了

相关文章：