Capas en Div

23torres23 · #1 (**permalink**) 20/12/2012, 12:47

Hola muy buenas a todos.Tengo una duda y me gustaria compartirla con todos vosotros:

1º Tengo una tabla con dos columnas y dos filas.
2º Dentro de una celda voy a insertar dos imagenes con los mismos tamaños
3º Por ultimo voy a insertar un boton fuera del formulario.

Tengo este codigo pero no se como hacer para que cuando ejecute la funcion solo se muestre una imagen y la otra permanezca oculta sin que cambien el tamaño de la celda y no se muestre un espacio en blanco del mismo tamaño que la imagen mas abajo.

Código HTML:

<html>
<head>

<script type="text/javascript" >

function mostrar(){
	
	
	    document.getElementById("img1").style.visibility = 'visible';
        document.getElementById("img2").style.visibility = 'hidden';

	
	}

function mostra(){
	
	
	    document.getElementById("img1").style.visibility = 'hidden';
        document.getElementById("img2").style.visibility = 'visible';

	
	}
</script>

</head>
<body>
<table width="174" height="250" border="1">
  <tr>
    <td width="104" height="150">
    
    <img src="http://phoenixdex.alteredorigin.net/images/pokemon/canon/natu.png" width="100" height="100" style="visibility:hidden" id="img1">
    <img src="http://www.morningkids.net/pokemon/177-natu-g.jpg" alt="" width="100" height="100" id="img2">
    
    </td>
    <td width="349">&nbsp;</td>
  </tr>
  <tr>
    <td></td>
    <td></td>
  </tr>
</table>

<input type="button"  onClick="mostrar();" value="Mostar Img1">
<input type="button"  onClick="mostra();" value="Mostar Img2">
</body>
</html>

Muchas Gracias!

Carlangueitor · #2 (**permalink**) 20/12/2012, 13:46

Sí entendí bien, solo tienes que usar display en lugar de visibility.

Saludos

23torres23 · #3 (**permalink**) 20/12/2012, 14:22

Cita:

Iniciado por Carlangueitor

Sí entendí bien, solo tienes que usar display en lugar de visibility.

Saludos

Lo que quiero es poner una capa debajo de otra. Me podrías poner el código. Gracias!

Carlangueitor · #4 (**permalink**) 20/12/2012, 14:27

Entonces si es lo que yo pensaba. Y como te dije, solo hay que usar la propiedad display en lugar de http://www.librosweb.es/referencia/css/visibility.html.

Saludos