Foros del Web » Creando para Internet » CSS »

mostrar/ocultar capas sin javascript

Estas en el tema de mostrar/ocultar capas sin javascript en el foro de CSS en Foros del Web. Hola, llevo un rato probando a ocultar/mostrar capas al pasar el ratón por una capa, pero no me sale, me explico: Tengo 2 capas, A ...
  #1 (permalink)  
Antiguo 26/09/2006, 06:11
 
Fecha de Ingreso: septiembre-2006
Mensajes: 15
Antigüedad: 11 años, 2 meses
Puntos: 0
mostrar/ocultar capas sin javascript

Hola, llevo un rato probando a ocultar/mostrar capas al pasar el ratón por una capa, pero no me sale, me explico:

Tengo 2 capas, A y B.

Al pasar por la capa A, tendría que hacerse visible la capa B.
Al salir de la capa A, debería desaparecer la capa B.

Creo que hace tiempo lo conseguí hacer, pero no hay manera, alguno me puede poner un ejemplo simple con 2 divs?

Gracias
  #2 (permalink)  
Antiguo 26/09/2006, 11:35
Avatar de fearlex  
Fecha de Ingreso: septiembre-2003
Ubicación: Exiliado de mi patria
Mensajes: 1.047
Antigüedad: 14 años, 2 meses
Puntos: 5
Esto fue lo mas cerca que logre, aunque aun no entiendo por que poner invisible los divs en vez de los divs, bueno cada cual sabe lo suyo :D

Cita:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<style type="text/css" media="screen">

#style1{
border: 1px solid #000000;
background: #993366;
}

a:hover {
visibility: hidden;
}

#style2{
border: 1px solid #000000;
background: #996633;
}

</style>
</head>
<body>

<div>
<a href="#"><div id="style1">Style 1</div></a>
<a href="#"><div id="style2">Style 2</div></a>
</div>
</body>
</html>
__________________
Ya viene llegando, el comunismo en Cuba, ya se esta acabando.
www.fearlex.com | www.fearlexworld.com
  #3 (permalink)  
Antiguo 26/09/2006, 11:59
 
Fecha de Ingreso: septiembre-2006
Mensajes: 15
Antigüedad: 11 años, 2 meses
Puntos: 0
Un amigo me ha ayudado:

Cita:

<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<style>
#div_b {
visibility: hidden;
background-color:#0000FF;
}

#div_a:hover #div_b { visibility: visible;}

#div_a{
width: 80px;
height: 20px;
background-color:#FF0000;
}
</style>
</head>
<div id="div_a">menu 1
<div id="div_b">opcion 1<br />opción 2</div>
</div>
<body>
</body>
</html>
  #4 (permalink)  
Antiguo 26/09/2006, 12:31
 
Fecha de Ingreso: septiembre-2005
Ubicación: Buenos Aires Argentina
Mensajes: 59
Antigüedad: 12 años, 2 meses
Puntos: 1
muy bueno clandes , pero no anda en IE 6 :( .
saludos
  #5 (permalink)  
Antiguo 26/09/2006, 12:37
 
Fecha de Ingreso: septiembre-2006
Mensajes: 15
Antigüedad: 11 años, 2 meses
Puntos: 0
Cita:
Iniciado por debian4tw Ver Mensaje
muy bueno clandes , pero no anda en IE 6 :( .
saludos
Ya, por no ir... no va ni el "ver codigo fuente" en mi web... y no he hecho nada raro... (ni IE 6 ni IE7)

Por suerte el efecto de las capas va en IE7... algo es algo... hay que ver que malo es el jodido.
  #6 (permalink)  
Antiguo 27/09/2006, 12:53
 
Fecha de Ingreso: diciembre-2003
Mensajes: 1.583
Antigüedad: 14 años
Puntos: 13
Clandes, lo que pasa es que hasta la versión 6 de Internet Explorer la pseudo-clase :HOVER sólo funciona sobre hipervínculos (es decir sobre elementos <A> que tengan el atributo HREF). Ahora en IE 7 funciona también sobre otro tipo de elementos (aunque no sé si todos).
  #7 (permalink)  
Antiguo 27/09/2006, 12:56
 
Fecha de Ingreso: septiembre-2006
Mensajes: 15
Antigüedad: 11 años, 2 meses
Puntos: 0
Cita:
Iniciado por frijolerou Ver Mensaje
Clandes, lo que pasa es que hasta la versión 6 de Internet Explorer la pseudo-clase :HOVER sólo funciona sobre hipervínculos (es decir sobre elementos <A> que tengan el atributo HREF). Ahora en IE 7 funciona también sobre otro tipo de elementos (aunque no sé si todos).
En cualquier caso, internet explorer es, y será siendo (en menod grado) una chapuza en su versión 7.
  #8 (permalink)  
Antiguo 19/02/2011, 21:16
 
Fecha de Ingreso: octubre-2010
Mensajes: 22
Antigüedad: 7 años, 1 mes
Puntos: 0
Respuesta: mostrar/ocultar capas sin javascript

Cita:
Iniciado por Clandes Ver Mensaje
Un amigo me ha ayudado:
este es el bueno!
  #9 (permalink)  
Antiguo 20/02/2011, 12:43
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 10 años, 6 meses
Puntos: 538
Respuesta: mostrar/ocultar capas sin javascript

ofnocron:
¿Tanta era la necesidad que tenía de hacer semejante "aportación" como para hacer caso omiso a la advertencia de no revivir un tema del 2006?



Yo creo que no. Pero es sólo mi opinión.
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Tema Cerrado




La zona horaria es GMT -6. Ahora son las 10:34.