Efecto de texto con movimiento temblor.
| Descripción del ejemplo JavaScript
Para este Script utilizamos una capa <DIV> identificada mediante el atributo id con el nombre de contenedor. Con el atributo style definimos una posición relativa en left=1px y top=1px. Dentro de esta capa escribimos el texto que tendrá el efecto de temblor. A este texto lo formateamos mediante un estilo creado con la etiqueta <STYLE>.
El JavaScript se ejecuta a la carga de la página mediante el evento onLoad de la etiqueta <BODY>. Este evento llama a la función TextoTiembla(). Lo primero que realiza el Script es asignar una nueva posición a la capa mediante el atributo left. Esta posición será la inicial 1px, la cual definimos en una variable posleft, más 2px. Con esto estaremos moviendo hacia la derecha 2 pixel la capa contenedora.
Después creamos un temporizador mediante setTimeout() el cual moverá nuevamente la capa a la posición inicial (left=1px). Esta operación la realiza al cabo de 30 milisegundos.
La condición if se ejecuta solo sí variable <= tiempotemblor. Mientras sea verdadera esta condición se ejecutará el setTimeout() que llama nuevamente a la función del JavaScript al cabo de 50 milisegundos. La diferencia de 20 milisegundos entre los setTimeout() es lo que produce el efecto de temblor en el texto.
Para que el texto tiemble una cierta cantidad de tiempo y luego deje de hacerlo utilizamos la variable variable que inicialmente tiene un valor de 1 y que se va incrementando luego de cada movimiento de la capa. Cuando el valor llega a 61 la condición if devuelve false y por lo tanto se ejecuta else que vuelve a dar el valor 1 a variable y ejecuta la función TextoTiembla() al cabo de los segundos definidos en repeticion. Con esto se vuelve a producir el efecto en el texto. Si no queremos volver a producir el efecto debemos dar un valor de cero (0) a esta variable.
Podemos hacer que el efecto en el texto sea continuo. Para esto debemos dar a la variable tiempotemblor un valor exageradamente alto, por ejemplo 1.000.000 (un millón).
Información relativa al Script
Ejemplo JavaScript para crear un efecto de temblor en el texto de la página.
Código fuente del script:
