Buscando lo que comentó Carlos, encontré como leer el estilo asignado en un
estilo y no en forma "intrusiva".
En FF es
document.defaultView.getComputedStyle(bloque,'').getPropertyValue("top").
En IE es document.getElementById ('bloque').currentStyle.top
acá va algo de código:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "
http://www.w3.org/TR/html4/strict.dtd";>
<html dir="ltr">
<head>
<style type="text/css">
#parrafo {position:absolute; top:500px; left:300px; width:200px;
height:100px; background-color: #99FFFF}
</style>
<script type="text/javascript">
<!--
function MoverTexto(id,d){
var bloque=document.getElementById(id);
alert (document.defaultView);
alert (bloque.currentStyle);
var x=(document.defaultView && document.defaultView.getComputedStyle) ?
document.defaultView.getComputedStyle(bloque,'').getPropertyValue("top")
:
bloque.currentStyle ? bloque.currentStyle.top : "";
var y=(document.defaultView && document.defaultView.getComputedStyle) ?
document.defaultView.getComputedStyle(bloque,'').getPropertyValue("left")
:
bloque.currentStyle ? bloque.currentStyle.left : "";
x= parseInt(x);
y= parseInt(y);
switch(d){
case "A": x -=10; break;
case "B": x +=10; break;
case "D": y +=10; break;
case "I": y -=10; break;
}
bloque.style.top=x+"px";
bloque.style.left=y+"px";
}
</script>
</head>
<body>
<p id="parrafo">HAZ CLIC EN LOS BOTONES PARA MOVER ESTE BLOQUE DONDE
DESEES</p>
<div><a href="#" onclick="MoverTexto('parrafo', 'A');">Arriba<a/> | <a
href="#" onclick="MoverTexto('parrafo', 'B');">Abajo<a/> | <a href="#"
onclick="MoverTexto('parrafo', 'D');">Derecha<a/> | <a href="#"
onclick="MoverTexto('parrafo', 'I');">Izquierda<a/> </div>
</body>
</html>
y el link de donde lo saqué:
http://www.mozillaes.org/foros/viewtopic.php?p=105219
GRACIAS CARLOS!!!!
El día 14/06/07, Juan José Montes de Oca Arbós <
[EMAIL PROTECTED]> escribió:
>
> Hola Hernan. Para "apagar" el setInterval, tenés que usar clearInterval,
> como bien vos decís.
>
> Cuando creaste el algo = setInteval... le asignaste un puntero de esa
> funcion a la variable algo, y como la variable "algo" nunca la declaraste,
> es de ambito "global". Al ser global, podés acceder a ella desde cualquier
> punto del código, y ese es el parametro que le tenes que pasar a
> clearInterval. Modificando tu programa, si el x es menor a 1000, entonces,
> usamos el clearInterval... te copio el código:
>
> <html>
> <head>
> <title>prueba</title>
> <script type="text/javascript">
> function mover(){
> miObjeto = document.getElementById('cosa');
> x = parseInt(miObjeto.style.left );
> if (x>100){
> x = x - 10;
> miObjeto.style.left = x + 'px';
> } else {
> clearInterval (esto);
> }
> }
>
> function arrancar(){
> esto = setInterval("mover()",50);
> }
> </script>
> </head>
>
> <body onLoad="arrancar()">
> <div id="cosa" style="position:absolute; width:100px; height:100px;
> left:1000px">
> <h1>holaaaaaaa</h1>
> <h1>aaaaaaaaaa</h1>
> </div>
> </body>
> </html>
>
> Saludos!!!!
>
> El día 14/06/07, "Hernán Beati - SaberWeb.com.ar" <[EMAIL PROTECTED]>
> escribió:
> >
> > Juan José Montes de Oca Arbós escribió:
> > > 1) si los declaraste en una
> > > sección STYLE o en un archivo CSS, al levantarlo con JS mediante
> > > objeto.style solo te devuelve los atributos cargados en el HTML.
> >
> > Muchísimas gracias, Juan José!! :-)
> >
> > No termina de sorprenderme que solo se pueda leer con JS valores de
> > propiedades CSS que hayan sido escritas adentro del tag, lo cual lo
> > vuelve a todas luces inaccesible (en el sentido de JavaScript no
> > intrusivo, separación en capas de contenido, presentación e interacción,
> > etc.). ¿No hay forma de mover un DIV de forma no intrusiva?
> >
> > Finalmente pude moverlo (intrusivamente, hasta ahora!) con un
> > setInterval, pero la llamada a la función se repite permanentemente
> > mientras dure en pantalla el documento, ¿cómo se podría "apagar" esto?
> > Si quiero llamar a clearInterval, como fue "encendido" desde otra
> > función llamada arrancar(), no es global y no lo puedo acceder desde la
> > función mover()
> > Pongo el código abajo.
> > Gracias!!
> >
> > Hernán.-
> >
> > <html>
> > <head>
> > <title>prueba</title>
> > <script type="text/javascript">
> > function mover(){
> > miObjeto = document.getElementById('cosa');
> > x = parseInt(miObjeto.style.left);
> > if (x>1000){
> > x = x - 10;
> > miObjeto.style.left = x + 'px';
> > }
> > }
> >
> > function arrancar(){
> > esto = setInterval("mover()",50);
> > }
> > </script>
> > </head>
> >
> > <body onLoad="arrancar()">
> > <div id="cosa" style="position:absolute; width:100px; height:100px;
> > left:1200px">
> > <h1>holaaaaaaa</h1>
> > <h1>aaaaaaaaaa</h1>
> > </div>
> > </body>
> > </html>
> > _______________________________________________
> > javaEScript mailing list
> > [email protected]
> > http://lists.scriptia.net/listinfo.cgi/javaescript-scriptia.net
> >
>
>
>
> --
> Juan José Montes de Oca Arbós.
>
> [EMAIL PROTECTED]
> [EMAIL PROTECTED]
> http://world5.monstersgame.es/?ac=vid&vid=58044309
> http://www.montesoft.com.ar
> http://www.es-facil.com/ganar/alta?Id=64395956
>
--
Juan José Montes de Oca Arbós.
[EMAIL PROTECTED]
[EMAIL PROTECTED]
http://world5.monstersgame.es/?ac=vid&vid=58044309
http://www.montesoft.com.ar
http://www.es-facil.com/ganar/alta?Id=64395956
------------ próxima parte ------------
Se ha borrado un adjunto en formato HTML...
URL:
http://lists.scriptia.net/pipermail/javaescript-scriptia.net/attachments/20070614/9498ccff/attachment.html
_______________________________________________
javaEScript mailing list
[email protected]
http://lists.scriptia.net/listinfo.cgi/javaescript-scriptia.net
