jquery - jQuery动画效果后动画效果，动画效果后

Question

$("#page1 .textblock.hidden").fadeIn('fast').animate({
    'marginTop': textblockpan - ($("#page1 .textblock").height() / 2),
}, 1500, function () {
    $(".title").fadeIn(500, function () {
        $("#building").animate({
            width: "147px",
            height: "147px"
        }, 1000, function () {
            $("#info001").animate({
                width: "147px",
                height: "147px"
            }, 1000)
        });
    });
}).removeClass('hidden').addClass('visible');    

找到了一些 jQuery 效果的良好启动代码，并在这里学习了如何让一个 jQuery 效果在另一个之后启动。上面的代码工作正常：我的文本块动画，标题淡入，#buildingdiv 变大。所以前三个效果以正确的顺序显示。但似乎我在插入第四个效果（动画#info001）时失去了控制。有人可以告诉我代码是否看起来不错，或者我确实迷路了){){{)){吗？

Answer 1

我看不出你的代码有什么问题，所以我猜问题出在其他地方。确保它#info001具有某种可以采用宽度和高度的布局（例如，block而不是inline）。

Answer 2

尝试在 .animate() 前面添加 .stop() 看看。？

$("#page1 .textblock.hidden").fadeIn('fast').animate({
    'marginTop': textblockpan - ($("#page1 .textblock").height() / 2),
}, 1500, function () {
    $(".title").fadeIn(500, function () {
        $("#building").stop().animate({
            width: "147px",
            height: "147px"
        }, 1000, function () {
            $("#info001").stop().animate({
                width: "147px",
                height: "147px"
            }, 1000)
        });
    });
}).removeClass('hidden').addClass('visible');