Me preguntaron si podía crear un efecto de texto en HTML usando jQuery donde obtengo una cadena y luego la rutina detecta automáticamente las palabras y anima cada palabra, una a la vez.

Me gusta.

seg en la animación muestra: "feliz"

seg en la animación muestra: "Happy New"

seg. en la animación muestra: "Feliz año nuevo"

seg. en la animación muestra: "Feliz año nuevo 2011"

cada palabra debería "desvanecerse / animarse" lentamente, pensé que un simple panel deslizante que iba directamente en píxeles sería satisfactorio, pero no. Palabra por palabra.

Podría necesitar algunas ideas sobre este. Sé algo de jQuery y mucho Javascript, así que creo que necesito un poco de ayuda con la parte de jQuery.

Para la lista de palabras, simplemente me dividiría en "" (espacios en blanco) y aceptaría que ",.!" etc son parte de una palabra

Pero, ¿cómo puedo animar esta "matriz dinámica" en jQuery? ¿Hay algún complemento en alguna parte o soy el primero?

Estaba pensando que quizás una lista con viñetas también podría ser el truco, luego hacerla flotar horizontalmente como un menú y luego agregar la palabra como una nueva viñeta, una vez por segundo. Pero estoy emocionado de ver lo que los expertos aquí encuentran para encontrar una solución. : O)

EDITAR De la respuesta marcada, tengo esto:

    var str = $('div#greeting h1').html(); // grab text
    $('div#welcome h1').html(""); // clear text

    var spans = '<span>' + str.split(" ").join(' </span><span>') + '</span>';
    $(spans).hide().appendTo('div#greeting h1').each(function(i)
    {
        $(this).delay(500 * i).fadeIn();
    });

La etiqueta FUERTE funciona, pero de alguna manera partes del texto se desvanecen en un grupo.

Pruebe esto: "aquí hay un texto de prueba. [Fuerte] Creemos que esto es mejor [/ fuerte] que nunca". y ver el problema