0

私はこれをしたい:

  1. 上から440までスクロール
  2. #detailアニメーションで開く
  3. id.html私の中にロードする#detail
  4. この HTML コンテンツに CSS アニメーションを作成しました

これを段階的に実行したい:

ステップ 2/ はステップ 1/ の後に実行されます。

ステップ 3/ はステップ 2/ の後に実行されます。

ステップ 4/ はステップ 3/ の後に実行されます。

しかし、問題が 1 つあります.load。関数が 2 回実行されます。理由がわかりません。

$('html,body').animate({scrollTop:(440)}, 1300,'easeInSine', function() {
    $('#detail').animate({height: detail_height}, 800, function() {
        $('#detail').load('pages/web/' + id + '.html', function() {
            //do something
    });
    });
});
4

1 に答える 1

1

n要素をアニメーション化すると、コールバックがn何度も発生します。それが意図した動作です。

複数の要素をアニメーション化するための単一のコールバックを取得する場合は、promise オブジェクトを使用します。

$('html,body').animate({scrollTop:(440)}, 1300,'easeInSine').promise().done(function() {
    $('#detail').animate({height: detail_height}, 800, function() {
        $('#detail').load('pages/web/' + id + '.html', function() {
            //do something
        });
    });
});

別の方法は、両方ではなく、html または body のみを選択することです。

于 2013-04-18T15:27:58.787 に答える