jQueryを使用してアニメーションが完了した後に関数を実行する方法


  1. コールバック関数を使用する方法:
$(element).animate({ properties }, duration, function() {
  // アニメーションが完了した後に実行されるコールバック関数のコードをここに書く
});

上記のコードでは、animate関数を使用して要素のプロパティをアニメーション化しています。アニメーションが完了した後に実行されるコールバック関数を指定するには、animate関数の最後の引数として関数を渡します。

  1. promiseオブジェクトを使用する方法:
$(element).animate({ properties }, duration).promise().done(function() {
  // アニメーションが完了した後に実行されるコードをここに書く
});

上記のコードでは、promiseオブジェクトを使用してアニメーションの完了を監視し、doneメソッドを使用して完了時のコードを指定しています。

  1. completeオプションを使用する方法:
$(element).animate({ properties }, {
  duration: duration,
  complete: function() {
    // アニメーションが完了した後に実行されるコードをここに書く
  }
});

上記のコードでは、completeオプションを使用してアニメーションが完了した後に実行される関数を指定しています。

これらの方法を使用することで、アニメーションが完了した後に任意の関数を実行することができます。適切な方法を選択し、必要なコードを実装してください。