Efecto de Texto ondulado con movimiento

El siguiente truco te servirá para crear un texto que se mueve de arriba hacia abajo, creando un efecto ondulado. El resultado es bastante bueno teniendo en cuenta el tamaño del script.

<html>
<head>
<title>Efecto 1</title>

var mensaje = "www.pagina.de/fuikas";
var color = 'black'; // O podríamos poner #0000ff

function Proximo(i,incmetodo,textLength)
{
if (incmetodo == 1) return (72*Math.abs( Math.sin(i/(textLength/3.14))) );
if (incmetodo == 2) return (255*Math.abs( Math.cos(i/(textLength/3.14))));
}

function Ciclo(text,metodo,dis)
{
salida = "";
for (i = 0; i < text.length; i++)
{
size = parseInt(Proximo(i +dis,metodo,text.length));
salida += "<font color='"+ color +"' style='font-size: "+ size +"pt'>" +text.substring(i,i+1)+ "</font>";
}
Capa.innerHTML = salida;
}

function Onda(n)
{
Ciclo(mensaje,1,n) ;
if (n > mensaje.length) {n=0}
setTimeout(" Onda(" + (n+1) + ") ", 50);
}
</script>

</head>
<body onLoad=" Onda(0) ;">

</html>

En este script puedes modificar tanto el mensaje como el color del mismo. Este último lo puedes poner con su equivalente en inglés o con su código hex.

Original de fuikas.tk

Usuarios que han visto este tema también han visto...

- Mostrar fechas con JavaScript
- Menú barra horizontal con botones para desplazar
- JQuery: expandir y colapsar un div
- Ver código de fuente de una página usando Javascript

- Versión imprimible de este documento

- Enviar por e-mail este documento