2017-05-10 4 views
0

Ich habe ein Bild, das den ganzen Bildschirm bedeckt. Alle 5 Sekunden wechselt das Hintergrundbild zu einem anderen mit einem Übergang. Dazu habe ich einen Header mit etwas nettem Text. Wenn sich das Bild ändert, möchte ich meinen Text ausblenden und dann mit einem anderen Text einblenden. Ich habe es halb fertig gemacht. Es ändert den Text und Fade sind in und aus. Aber es macht es in einer seltsamen Reihenfolge. Hier ist mein Code, der die Änderung tut.JQuery - Fade out Text vor dem Texte changing Text

$("header h1").fadeOut(500); 
$("#bildfram").css("background-image", "url(" + bilder[bild] + ")"); 
$("header h1").text("GeForce | " + text[bild]); 
$("header h1").fadeIn(500); 

, dass die Reihenfolge ist, dass der Code in ist aber die Ausführung ist ein bisschen komisch. Auf der Website ist die Ausführung wie folgt aus:

Change background image ($("#bildfram").css("background-image", "url(" + bilder[bild] + ")");) 
Change the text ($("header h1").text("GeForce | " + text[bild]);) 
Fade out the text ($("header h1").fadeOut(500);) 
Fade in the text ($("header h1").fadeIn(500);) 

Ich möchte den Code in der Reihenfolge ausgeführt werden, dass das Skript geschrieben wird, FadeOut Text, Bild ändern, ändern Text, FadeIn Text.

Vielen Dank im Voraus!

Antwort

5

Um etwas nach $.fadeOut() zu beenden, müssen Sie die Änderung in einen Rückruf von $.fadeOut() setzen.

$("header h1").fadeOut(500, function() { 
    $("#bildfram").css("background-image", "url(" + bilder[bild] + ")"); 
    $("header h1").text("GeForce | " + text[bild]); 
    $("header h1").fadeIn(500); 
}); 
+0

Danke für die Hilfe! :) – robeng