JS wartet nicht bis function fertig ist (jQeury)

[MizeKatzi]

Hallo,

hab ein Formular, welches ich mit Ajax abschicke.
jQuery + Form Plugin.

Hier ist der JS Code

$(document).ready(function() {  
$('#myForm').ajaxForm({  
        data: { Ajax: '1' },  
        beforeSubmit:  beforeSEND,  // pre-submit callback  
        success:       resultHANDLE  // post-submit callback  
        });  
    });  
  
function beforeSEND () {  
    $('#myForm').fadeTo(0, 0.5);  
    $("textarea").addClass('loading');  
    $("textarea").animate({backgroundPositionX: 0},1500});  
}  
  
function resultHANDLE (responseText) {  
    // Do somethig with the result  
}

Die Funktion "beforeSEND" wird vor dem Ajax Request ausgeführt. Liefert diese false zurück, wird alles abgebrochen, sonst läufts weiter.

In den letzten 2 Code Zeilen in der Funktion "beforeSEND" wird einer Textarea ein Hintergrundbild hinzugefügt und dieses in der nächsten Zeile innerhalb von 1,5 Sekunden entlang geschoben. So wie eine Art Ladebalken.

Jedoch wartet JavaScript natürlich nicht bis diese Animation fertig ist, sondern sobald die Antwort kommt wird die Funktion "resultHANDLE" aufgerufen.

Ich möchte aber nun, dass der User diese Animation vollständig sieht bevor der Request abgesendet wird.

Kann mir irgendwer helfen? Tut mir leid, falls ich mich schlecht ausgedrückt habe, bitte einfach nachfragen...