Autor Tema: Capa (in)móvil  (Leído 2484 veces)

Desconectado Flugtelero

  • Member
  • ***
  • Mensajes: 168
Capa (in)móvil
« en: 13 de Abril de 2007, 12:48:10 pm »
Hola, tengo un código mediante el cual se supone que una capa se presenta en movimiento. Sin embargo, en IE se limita a bajar diagonalmente de derecha a izquierda y luego queda quieta. Con Firefox no sucede ni eso, aparece y sigue inmóvil desde el principio. El código es:

  <div id="capa1" style="background: blue; none repeat scroll 0%; left: 700px; position: absolute; top: 10px; width: 300px; z-index: 2; -moz-background-origin: initial; -moz-background-inline-policy: initial;">
ESTO SE MUEVE
</div>
<script language="JavaScript">
var posicionX=700;
var posicionY=10;
function mueve_capa() {
if (posicionX>10) {
posicionX=posicionX-5;
capa1.style.left=posicionX;
posicionY=posicionY+1;
capa1.style.top=posicionY;
}
setTimeout("mueve_capa()", 50);
return;
}
setTimeout("mueve_capa()", 10);
</script>

¿Hay algún error en alguna parte? :???:

 

Desconectado Piero

  • Member
  • ***
  • Mensajes: 183
Re: Capa (in)móvil
« Respuesta #1 en: 20 de Abril de 2007, 12:49:00 am »
Hola Flugte.

Este script me funciona de la misma manera tanto en el IE com en el Firefox.

Francamente no consigo verle mucha utilidad. Se le pueden regular las posiciones iniciales y finales y la velocidad con la que se desplaza el texto (además, obviamente del estilo del mismo) pero siempre tendrá que moverse de derecha a izquierda en sentido oblicuo u horizontal  sino, de otra manera, se obtienen efectos paradójicos e indeseables, como que la capa siga moviéndose hacia abajo o hacia la derecha de forma indefinida haciendo desaparecer el contenido de la página.

No se si te puede resultar útil, pero te voy a decir lo que entiendo de este script diciéndote como lo leo (tómalo todo con pinzas porque, como ya sabrás, yo no entiendo mucho de estas cosas)

Empezamos por la parte en html:

Se utiliza la etiqueta <div> a la que se le asigna un “identficador” (id=”capa1”)
Eso equivale, de alguna manera a “bautizar” nuestra capa y permite, entre otras cosas, que el fragmento en JS haga referencia a esta capa en concreto.
Se le asigna, también, un estilo en el que se define el color de fondo (background: blue;), una posición absoluta, o sea, independiente de la de cualquier otro “contendor” de la página (left: 700px; position: absolute; top: 10px; left: 700px; position: absolute; top: 10px;)
width: 300px; Esto define el ancho de la capa
z-index: 2;  para que la capa se coloque por encima de otros elementos.
-moz-background-origin: initial; -moz-background-inline-policy: initial;  para obligar el Firefox a utilizar los mismos puntos de referencia que el IE a la hora de colocar la capa en la pantalla.
none repeat scroll 0%   esto no se porqué lo han puesto. Me parece que no sería necesario pero, probablemente, aumenta la compatibilidad entre navegadores.


La parte en JS:

Se definen dos variables que se bautizan “posicionX” y “posicionY” y se le asignan valores numéricos.
Luego se declara una función: “mueve_capa
Y se pone una condición if que viene a decir algo como esto: mientras la variable posicionX sea superior a 10, réstale 5 y a la variable posicionY añádele 1

(Así que la capa dejará de moverse sólo cuando deje de cumplir la condición de >10 o sea que se parará a 10 px del borde izquierdo de la pantalla)


capa1.style.left=posicionX;
capa1.style.top=posicionY;
se indica que los valores numéricos de las variables (obviamente calculados según la condición if) se aplican a la posición de la capa1


setTimeout("mueve_capa()", 50);
return;
y
setTimeout("mueve_capa()", 10);
Esto indica con que velocidad se moverá la capa.

Total, que no te he dicho nada: sólo he traducido a un leguaje un poco más humano lo que pone en esas líneas de código.

Saludos. Piero
Olympus  E 510  -  gran angular: 9-18mm -  zoom medio: 14-54  -  macro: 50  -  tele: 45-150

Desconectado Flugtelero

  • Member
  • ***
  • Mensajes: 168
Re: Capa (in)móvil
« Respuesta #2 en: 20 de Abril de 2007, 06:53:50 pm »
Muchas gracias por tu aportación, Piero :-), la verdad es que los dichosos javascript a veces dan bastante guerra. Como bien dices, la utilidad de ese tipo de jerigoncios es muy relativa, pero son opciones a considerar cuando se desea insertar en una página algún aderezo dinámico (por supuesto, con la debida moderación), sobre todo frente a sofisticaciones como Flash. Lo que me irrita del código de marras es que me funciona sólo con IE. Por si acaso revisaré la parte que ejerce de "trágala" para el Firefox, a ver si he cometido alguna errata.

    Un saludo y gracias de nuevo ;-)

 

Aviso Legal | Política de Privacidad | Política de Cookies

el contenido de la web se rige bajo licencia
Creative Commons License