Comunidad de diseño web y desarrollo en internet online

Mover capas con javascript

Citar            
MensajeEscrito el 17 Jun 2008 11:53 am
Hola socios,
Tengo un problemilla facil de solucionar (con ayuda).

Utilizo un xml para generar imágenes (botones).
Éstos estan dentro de un div, con una altura máxima de 450px.

Y tengo arriba y abajo 2 botones encargados de subir o bajar ese div cuando la altura de 450 se quede pequeña.

Éste codigo me sirve para mover una capa:

Código :

function bajar(nombreCapa){ 
valor=document.getElementById(nombreCapa).style.top; 
numero=parseInt(valor); 
numero+=15; 
document.getElementById(nombreCapa).style.top=numero; 
} 


Pero me pasa lo siguiente: El div que quiero mover debe estar anclado a una tabla (no quiero que su position sea absoluta, pq si no se superpone a las cosas).

Os dejo imágen explicativa de lo que quiero hacer: http://img504.imageshack.us/img504/6779/muestrawc4.jpg

Gracias y un saludo!

Por Keten

36 de clabLevel



Genero:Masculino  

Madrid

msie7
Citar            
MensajeEscrito el 17 Jun 2008 12:20 pm
¿div anclado a una tabla?
Suena horroroso.

De todas maneras, no encuentro el motivo de tu consulta.
Con la función que pones, debería hacer scroll.

Por El Oso Amoroso

Claber

1780 de clabLevel

6 tutoriales

 

Madrid, España, Europa, Eurasia, La Tierra, Sist.Solar, Vía Láctea, UNIVERSO

firefox
Citar            
MensajeEscrito el 17 Jun 2008 01:42 pm
jajaa... me refiero, que tengo el div dentro de una tabla.. si le pongo position:absolute se me va a pirar por ahi...
Y quiero que al poner el raton encima de el boton "bajar" o "subir", baje/suba contínuamente el div del medio hasta dar en los topes.

Por Keten

36 de clabLevel



Genero:Masculino  

Madrid

msie7
Citar            
MensajeEscrito el 17 Jun 2008 02:42 pm
No deberías poner el <div> dentro de una <table> para eso.
Un <div> con "position:absolute;", dentro de otro <div> con "position:relative;" se comporta como si estuviera "relative".
Vamos, que no necesitas la <table>.

Se me ocurre que puede hacerlo:

Código :

<div style="position:relative;width:__;height:__;overflow:hidden;">
<div style="position:absolute;width:100%;height:HHpx;overflow:hidden;left:0px;top:0px;" id="SCROLLED">
<!-- Contenido sobre el que se hace scroll //-->
</div>
</div>

manejado por una modificación de tu función:

Código :

function bajar()
{valor=document.getElementById(SCROLLED).style.top; 
 numero=parseFloat(valor)-15;
 if(numero<-HH)
        {document.getElementById(SCROLLED).style.top=numero+'px';}
     else
        {document.getElementById(SCROLLED).style.top=-HH+'px';}
} 

Por El Oso Amoroso

Claber

1780 de clabLevel

6 tutoriales

 

Madrid, España, Europa, Eurasia, La Tierra, Sist.Solar, Vía Láctea, UNIVERSO

firefox
Citar            
MensajeEscrito el 17 Jun 2008 02:57 pm
muchas gracias por la ayuda rizome, lo probaré

Por Keten

36 de clabLevel



Genero:Masculino  

Madrid

msie7

 

Cristalab BabyBlue v4 + V4 © 2011 Cristalab
Powered by ClabEngines v4, HTML5, love and ponies.