| El script | Como funciona |
| //Mas en: http://javascript.espaciolatino.com/
<script language="JavaScript" src="rutbasicas.js"> |
Este ejemplo utiliza
los objetos móviles, que se encuentrqan en la sección de
Aplicaciones de esta web (también lo tienes al final de esta página), para construir esta estrella viajera atravesando
la página.
Si lees la documentación de esos objetos te será fácil
comprender el funcionamiento de estos scripts. La función que
desencadena todo el movimiento es iniAnima(), en ella se define estnav
como un objeto oMovil( ), los argumentos para crearlos son: ID de la
capa DIV donde se encuentra la estrella, posiciones X, Y iniciales y
finales del movimiento, tiempo que debe tardar ese movimiento, un valor
lógico (true o false) para indicar se el objeto debe permanecer
visible al acabar el movimiento y el nombre de la función que
define el movimiento de la estrella, esta última función
es optativa, si no se usa la estrella se moverá linealmente desde
la posición inicial a la final. En este ejmplo se ha usado una
función senoidal, puedes usar cualquier otra. Si quieres que el
movimiento se repita una y otra vez sólo tienes que añadir
la sentencia:
animEst.enlazar('animEst',null,3000); |
| La página | Como se usa |
| <body color ="#FFFFFF" onload="iniAnima()"> <DiV id="estrella" style="position:absolute; z-index:1; width: 1; height: 1; overflow: visible; left: 6px; top: 14px"><img src="../../simbolos/estnav.gif" width="57" height="37"></div> < !--Contenido de tu página--> </body> |
En la página sólo debes colocar la llamada a la función que inicia todo el movimiento y por supuesto un bloque DIV para contener a la figura que desees mover, puede ser la estrella del ejemplo o un Papá Noel o los tres reyes magos o los renos .... No olvides enlazar en la sección HEAD los scripts necesarios que encontrarás en la sección Aplicaciones. |
| El script en funcionamiento |
| Pincha aquí con el ratón para ver el script en funcionamiento en una ventana nueva. Si te gusta puedes bajar todo lo necesario para usarlo en este enlace |