Question

function moveto(step1, step2, step3) {
    var w = $(document).width();
    var h = $(document).height();
    $('#full').animate({
        left: -(step1 * w)}, {
        duration: 1000,
    });
    $('#full').animate({
        top: -(step2 * h)
    }, {
        duration: 1000,
    });       
}

我需要这个功能来动画一次，然后用不同的步骤做另一个动画。

Answer 1

您必须使用complete callback：

来链接动画

function move(step1, step2, step3) {
    $('#full').animate({
        left: '+=' + step1,
    }, 1000, function() {
        $(this).animate({
            top: '+=' + step2,
        }, 1000, function() {
            $(this).animate({
                left: '-=' + step3
            }, 1000);
        });
    });   
}

以下是演示：http://jsfiddle.net/RHCqQ/

Answer 2

 $('#full').animate({left: -(step1 * w)}, {duration: 1000,}, function () {
        $('#full').animate({ top: -(step2 * h) }, {duration: 1000,});

} );

U也可以将回调函数传递给动画函数，一旦动画结束，你的回调函数就会被执行。在回调函数中，你可以用不同的步骤调用其他动画。

你拿一个数组并使用回调函数逐个调用这些步骤。

动画多个步骤

2 个答案: