Ereignis nachdem ein div die Animation beendet hat?

Question

Wie kann ich eine Funktion ausführen, nachdem ein bestimmtes Element die Animation beendet hat? Es ist eine Slide-Down-ähnliche Animation, das Element ist verborgen und wenn etwas angeklickt wird, wird es sichtbar, indem es seinen Inhalt nach unten verschiebt (+ Höhe).

Ich habe keine Kontrolle über die Animationsfunktion auf dieses Element, so kann ich nicht die Callback-Option aus dem .animate Funktion $ verwenden ...

Im Moment habe ich so etwas wie

$('.trigger').click(function(){ // <-- "trigger" will make the element animate 
    setTimeout(myfunction, 500); 
}); 

, die funktioniert, aber ich mag es nicht, fühlt sich hacky

Answer 1

wenn Sie jQuery verwenden 1.5+ Sie die jQuery promise() Methode verwenden: http://jsfiddle.net/rGBk7/

z.B.

/* do animation */ 
$("div").animate({ 'marginLeft' : '300px' }, 1000); 

/* attach a promise to animated element/s */  
$("div").promise().done(function() { 
    alert("animation end"); 
}); 

Siehe http://api.jquery.com/promise/

Answer 2

Meinten Sie:

$("div").queue(function(){ 
    your_function(); 
}); 

Es wird nach der Animation Warteschlange ausgeführt werden vollständig