Hola amigos.
Antes que nada quiero deciros que es un placer para mi participar en este foro. Quiero de paso dar la enhorabuena a sus gestores y moderadores, así como a todos aquellos que participan en él y ofrecen sus aportaciones de manera desinteresada; bien de forma activa, ofreciendo respuestas, o pasiva, generando nuevas preguntas.
Y dicho esto, observo con cierta perplejidad los complejos códigos que se utilizan para realizar ciertos comportamientos en las páginas. Obras maestras de la ingeniería informática, pero que en mi modesta opinión se complican en exceso.
Llevo programando en JavaScript desde el año 2001, y siendo verdad que no domino dicho lenguaje al 100%, algo entiendo. De hecho, quienes saben de programación mucho más que yo, saben también que de todo el lenguaje, es apenas el 50% el que suele utilizarse. El resto o bien está almacenado en códigos fuente, o simplemente no se utilizan.
Un ejemplo de lo que muchas veces nos complicamos para llegar a soluciones pequeñas es el movimiento circular de una capa <div>.
Antes de comenzar a trabajar por mi cuenta, supervisé algunos códigos que encontré por la web. Efectivamente la mayoría de ellos eran obras maestras de la arquitectura informática, muy difíciles de entender por alguien con una formación tan básica como la mía. Sin embargo, aunque funcionaban, derrochaban código en exceso. Es como matar moscas a cañonazos.
Para no excederme en el artículo expongo la siguiente dirección donde puede verse una manera compleja de conseguir un movimiento circular (en realidad es un movimiento en forma de 8 tumbado, como el signo de infinito).
http://www.htmlpoint.com/dynamic/grafica/grafica14.htm
Si quieres que un <div> realice un movimiento circular, nada tan fácil como el siguiente código:
<html>
<head>
<meta http-equiv="Content-Language" content="es">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Pagina nueva 2</title>
</head>
<script language=javascript>
//definimos la variable que incrementará el valor de un ángulo que parte de 0
valor=0;
function girar(){
//Incremento progresivo del ángulo con valor 0.04; el valor 0.04 establece la
//precisión del movimiento. A mayor valor, menor precisión. Si damos
//un valor muy alto, el movimiento irá a "saltos"
valor=valor+0.04;
//Generamos valores de seno y coseno de la variable valor
posicion=Math.sin(valor);
posicioncos=Math.cos(valor);
// Asignamos las fórmulas anteriores a dos variables que establecerán
// los movimientos horizontal y vertical
posicion1=(posicion*100)+200;
posicion2=(posicioncos*100)+200;
//Asignamos las variables anteriores a las posiciones left (horizontal) y top (vertical)
capa.style.left=posicion1+'px';
capa.style.top=posicion2+'px';
//Hacemos que la función se repita una y otra vez cada 10 milisegundos
setTimeout('girar()',10)
}
</script>
//Configuramos el body para que al cargarse la página se inicie la función girar()
<body onload="girar()"><form name=f1>
<div style="position: absolute; width: 100px; height: 100px; z-index: 1; left: 351px; top: 134px" id="capa">
<table border="1" width="100%" id="table1" height="106">
<tr>
<td bgcolor="#800000"> </td>
</tr>
</table>
</div>
</form>
</body>
</html>
Haz un copia y pega en un *.txt. Cambia la extensión a HTML, y al abrirla en tu navegador verás el <div> moverse en forma circular.