jQuery FadeIn / FadeOut, scorrendo un array

Question

A questo URL - http://thespacebetweenthewords.org/sandbox/

Sto tentando di passare in rassegna gli array di parole con un jQuery FadeIn / FadeOut effetto.

L'array di parole visualizzate non sembra essere a partire da [0], anche se. Sto forse manca qualcosa con l'ordine in cui il le funzioni sono in esecuzione.

Se qualcuno nella comunità vorrebbe commentare il codice come si stand finora, l'intuizione è apprezzato.

Answer 1

Si correttamente utilizzando una funzione di callback con .fadeIn() al fine di garantire che la parola non inizia a fade out finché non è finito dissolvenza. Tuttavia, non avete applicato lo stesso principio per l'iterazione attraverso i verbi. Il tuo ciclo for esterno si strappa attraverso tutti i verbi in poco tempo, mostrando ciascuno, e poi pazientemente in attesa fino a quando è il momento di nasconderli (quando, ovviamente, solo il più recente, verbo sarà ancora mostrando per allora).

Si potrebbe provare qualcosa di simile:

function showWord(selector, words, wordTime, i) {
    if (words.length < i)
        return;
    var word = words[i];
    $(selector).html(word).fadeIn(wordTime, function() {
        $(selector).fadeOut(wordTime, function() {
            showWord(selector, words, wordTime, i + 1);
        });
    });
}
showWord("#verb-content", data.verbs, verbTime, 0);