0 
$("#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');

Found and a good startcode for some jQuery effects and learned here how you should let one jQuery effect starts after a other. The code above works fine: my textblock animates in, the title is fading in and the #building div becomes bigger. So the first three effects show up in the correct order. But seems to be I lost control with inserting the fourth effect (animate #info001). Can somebody tell me if the code is looking fine or that indeed i lost my way in all the ){){{)){?

4

2 に答える 2

1

私はあなたのコードに問題を見つけることができないので、問題は別の場所にあると推測しています. #info001幅と高さを取ることができるある種のレイアウトがあることを確認してください(たとえば、 のblock代わりにinline)。

于 2013-06-26T09:35:30.490 に答える
0

.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');
于 2013-06-26T09:41:23.920 に答える