Foros del Web » Creando para Internet » CSS »

al pasar mouse por una div hacer que aparezca otra en otro lugar?

Estas en el tema de al pasar mouse por una div hacer que aparezca otra en otro lugar? en el foro de CSS en Foros del Web. Como puedo hacer... al pasar mouse por una div hacer que aparezca otra en otro lugar? es posible esto?...
  #1 (permalink)  
Antiguo 26/08/2011, 18:46
 
Fecha de Ingreso: mayo-2011
Mensajes: 167
Antigüedad: 5 años, 6 meses
Puntos: 1
al pasar mouse por una div hacer que aparezca otra en otro lugar?

Como puedo hacer...
al pasar mouse por una div hacer que aparezca otra en otro lugar?
es posible esto?
  #2 (permalink)  
Antiguo 27/08/2011, 03:43
 
Fecha de Ingreso: agosto-2010
Ubicación: Tenerife
Mensajes: 893
Antigüedad: 6 años, 3 meses
Puntos: 202
Respuesta: al pasar mouse por una div hacer que aparezca otra en otro lugar?

Eso se consigue cambiando las propiedades de la CSS (p.e: display) con Javascript ya que requiere de un evento.
La CSS tiene el :hover, pero sólo se aplica para ese objeto o los elementos que contenga, por ejemplo un menu desplegable, por tanto no es posible desde hojas de estilo.

Necesitas lenguaje que se ejecute en el cliente.
Pregunta en el foro correspondiente.
__________________
Pensaba que internet era una gran biblioteca de sabiduría, hasta que comprendí que un libro no puede tener mil páginas llenas de faltas de ortografía... :(
  #3 (permalink)  
Antiguo 27/08/2011, 06:07
Avatar de IsaBelM
Colaborador
 
Fecha de Ingreso: junio-2008
Mensajes: 5.032
Antigüedad: 8 años, 5 meses
Puntos: 1008
Respuesta: al pasar mouse por una div hacer que aparezca otra en otro lugar?

en realidad sí que se puede hacer con css. hay que usar el selector de adyacente
Cita:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta content="text/html; http-equiv="Content-Type" charset=utf-8"/>
<title></title>
<style type="text/css">
html, body {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
overflow: hidden;
position: relative;
}

#liga:hover + div {
display: block;
width:100px;
border: 1px solid #111;
position: absolute;
top: 100px;
left: 200px;
}

#tooltip{
display: none;
}

</style>
</head>
<body>
<div id="liga">link</div>
<div id="tooltip">Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure</div>
</body>
</html>
  #4 (permalink)  
Antiguo 27/08/2011, 06:32
 
Fecha de Ingreso: agosto-2010
Ubicación: Tenerife
Mensajes: 893
Antigüedad: 6 años, 3 meses
Puntos: 202
Respuesta: al pasar mouse por una div hacer que aparezca otra en otro lugar?

IsaBelM pero hasta donde yo sé eso te va a coger el siguiente div, si hay otros por medio creo que no se obtendría el mismo resultado ¿No?

Me refiero a algo así:

Código CSS:
Ver original
  1. <div id="liga">link</div>
  2. <div id="otro"></div>
  3. <div id="tooltip">Lorem ipsum dolor sit amet</div>

En estos casos siempre los he visto usando js.
Pregunto porque en caso de poderse aprendería una cosa nueva
__________________
Pensaba que internet era una gran biblioteca de sabiduría, hasta que comprendí que un libro no puede tener mil páginas llenas de faltas de ortografía... :(
  #5 (permalink)  
Antiguo 27/08/2011, 07:48
Avatar de IsaBelM
Colaborador
 
Fecha de Ingreso: junio-2008
Mensajes: 5.032
Antigüedad: 8 años, 5 meses
Puntos: 1008
Respuesta: al pasar mouse por una div hacer que aparezca otra en otro lugar?

tenemos que partir de la base que no sabemos la estructura.

en el caso que tu expones habría que cambiar el selector de adyacente por el selector general de hermanos, además de usar selector de atributo
Cita:
#liga:hover ~ div[id="tooltip"]
  #6 (permalink)  
Antiguo 27/08/2011, 08:09
 
Fecha de Ingreso: agosto-2010
Ubicación: Tenerife
Mensajes: 893
Antigüedad: 6 años, 3 meses
Puntos: 202
Respuesta: al pasar mouse por una div hacer que aparezca otra en otro lugar?

oks, gracias.
__________________
Pensaba que internet era una gran biblioteca de sabiduría, hasta que comprendí que un libro no puede tener mil páginas llenas de faltas de ortografía... :(

Etiquetas: aparezca, mouse, pasar
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.
Respuesta




La zona horaria es GMT -6. Ahora son las 08:32.