JQuery Inhalt aus einem Stringarray fadeIn und FadeOut

[Shrax]

Hallo!

Ich möchte eine Funktion schreiben der man ein Stringarray und ein HTML-Element (also eine Klasse oder eine ID) übergibt. Diese Funktion soll dann mit JQuery den ersten String (array[0]) einfaden (JQuery FadeIn), dann z. B. 5 Sekunden warten und den string wieder rausfaden (JQuery FadeOut). Danach wird gewartet (z. B 500 Millisekunden) und der nächste String wird eingefaded. Und so weiter.
Sind alle Elemente des Arrays durch soll die Funktion sich beenden (Optional noch ein "return true" ausführen).

Leider sitze ich hier schon einige Stunden und komme auf keinen guten Ansatz.

Mein derzeitiger Ansatz der jedoch garnicht funktioniert:

$(document).ready(function() {

var strings = ["string1", "string2", "string3"];

function fadeStringsFromArray(array, index) {

$(".textbox").text(array[index]);
$(".textbox").fadeIn(1000, function() { } ).delay(2000).fadeOut(200, fadeStringsFromArray(array, index+1));
}
$(".textbox").hide();
fadeStringsFromArray(strings, 0);

});

Hier ist .textbox noch fest codiert.

Habt ihr vielleicht Hilfen für mich?

 

[Tronjer]

Ich hatte etwas in der Art auf meiner alten HP integriert, nur dass das Array bei mir endlos durchläuft. Schau dir mal die Methode languages in der main.js an.

http://goo.gl/WS7B3o

 

[pax]

Ein relevanter Fehler in deinem Code ist auf jeden Fall das grenzenlose Hochzählen des index. Du solltest array.length testen und nur im Fall des Falles die Funktion erneut aufrufen. Außerdem scheint mir dein Chaining etwas abenteuerlich. Wo du keine Callbackfunktion brauchst, machst du eine leere und wo du eine brauchen würdest, schreibst du eine Anweisung.

Wenn man diese Fehler beseitigt:

  if(index<(array.length-1)){
     $(".textbox").fadeIn(1000).delay(2000).fadeOut(200, function() {fadeStringsFromArray(array, index+1) });
  }

dann funktioniert es im Ansatz, hat aber noch viel Verbesserungspotential ;)