sábado, 25 de mayo de 2013

Animaciones repetivas en javascript - Parte 4

No es extraño que te preguntes a esta altura cómo hacer para realizar movimientos ondulatorios. Muy bien sabemos que el diseño de una página web animada no puede bastarse con unos movimientos horizontales o verticales uniformes.
Aquí es donde entran en juego los conocimientos de matemática que aprendiste en la escuela. En esta ocasión nos detendremos solamente sobre la función del seno. En el próximo artículo veremos cómo aplicarlo en nuestra función animada.
Bien, ¿recuerdas la función del seno? La función tenía esta forma
y = sen(x)
Y su gráfica era una sinusoide como ésta:

En javascript evitaremos la escritura de “y=” y nos quedaremos sólo con “sen(x)”. En verdad, la función javascript para el seno tendrá la siguiente sintaxis:
Math.sin(x)
La función, como recordarás, arroja un valor para un argumento determinado. Por ejemplo, si nosotros escribiésemos:
alert(Math.sin(1));
al ser leída se dispararía un alert en cuyo contenido obtendremos el resultado de aplicarle el seno a 1, es decir, 0.8414709848.
Como pueden ver en la gráfica, los valores para la función sen(x) se encuentran entre -1 y 1. Esta es la llamada amplitud de onda. Si queremos modificar la amplitud de onda, por ejemplo, para que los valores estén entre -2 y 2, entonces sólo debemos multiplicar el sen(x) por 2:
alert(2*Math.sin(x));
Otras modificaciones importantes son:
*la modificación del período: Math.sin(2*x)
*el corrimiento de la gráfica respecto del eje y: Math.sin(x - 2)
*el corrimiento de la gráfica respecto del eje x: Math.sin(x ) – 2

Todas ellas las puedes encontrar en cualquier manual de la escuela secundaria.

La próxima vez veremos cómo aplicar esto en el diseño de sus páginas web.

por Juan
para ae Soluciones web - Diseño de páginas web en Argentina


No hay comentarios:

Publicar un comentario