Скажем, что у меня сразу несколько анимаций, и я хочу вызвать функцию, когда все они закончены.
Только с одной анимацией это легко; там обратный вызов для этого. Например:
$(".myclass").fadeOut(slow,mycallback);
Проблема в том, что если мой селектор обнаружит несколько элементов, обратный вызов будет вызываться для каждого из них.
Обходной путь не слишком сложный; например:
<!DOCTYPE html>
<html>
<head>
<title>Example</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function() {
var $mc=$(".myclass"),l=$mc.length;
$mc.fadeOut("slow",function(){
if (! --l) $("#target").append("<p>All done.</p>");
});
});
</script>
<style type="text/css">
</style>
</head>
<body>
<p class="myclass">Paragraph</p>
<p class="myclass">Paragraph</p>
<p class="myclass">Paragraph</p>
<p class="myclass">Paragraph</p>
<p class="myclass">Paragraph</p>
<p class="myclass">Paragraph</p>
<div id="target"></div>
</body>
</html>
Мой вопрос: есть ли лучший способ сделать это?