Foros del Web » Creando para Internet » CSS »

[SOLUCIONADO] Hacer hover sobre la capa de debajo cuando hay dos capas solapadas

Estas en el tema de Hacer hover sobre la capa de debajo cuando hay dos capas solapadas en el foro de CSS en Foros del Web. Pues eso: Estoy intentando hacer un zoom de una imagen en el mismo sitio de la misma imagen. Tengo 2 capas solapadas una encima de ...
  #1 (permalink)  
Antiguo 12/09/2013, 08:52
Avatar de mdromed  
Fecha de Ingreso: septiembre-2009
Mensajes: 389
Antigüedad: 12 años, 11 meses
Puntos: 8
Hacer hover sobre la capa de debajo cuando hay dos capas solapadas

Pues eso:

Estoy intentando hacer un zoom de una imagen en el mismo sitio de la misma imagen.
Tengo 2 capas solapadas una encima de otra.
La de arriba (Capa 1) solo muestra un icono de una lupa en una esquina.
Quiero que al ponerme encima con el raton sobre la lupa ya se haga zoom sobre la foto, es decir, quiero q el efecto hover se realice sobre la capa de debajo de la lupa (capa 2), pero cuando me pongo sobre la capa 1.

No se si me explico.
En este ejemplo lo hacen asi, pero no soy capaz de descifrar que parte del css es la que logra eso.

Para hacer lo que digo is a: http://www.jacklmoore.com/zoom/ y en la foto del perro negro (la primera de la izquierda) vereis que hay una lupita en la parte superior derecha. Pues bien, si pasais el raton por encima de la lupa vereis como el hover de la capa de debajo sigue funcionando.

Eso es lo que intento hacer yo.
¿Alguna idea de que css es el que permite eso?
  #2 (permalink)  
Antiguo 12/09/2013, 09:21
Avatar de mdromed  
Fecha de Ingreso: septiembre-2009
Mensajes: 389
Antigüedad: 12 años, 11 meses
Puntos: 8
Respuesta: Hacer hover sobre la capa de debajo cuando hay 2 capas solapadas

Creo q lo logran con el selector ":after".
¿Me lo puede alguien confirmar?

garcias
  #3 (permalink)  
Antiguo 12/09/2013, 14:39
Avatar de pzin
Moderata 😈
 
Fecha de Ingreso: julio-2002
Ubicación: Islas Canarias
Mensajes: 10.487
Antigüedad: 20 años
Puntos: 2114
Respuesta: Hacer hover sobre la capa de debajo cuando hay dos capas solapadas

::after es un pseudo-elemento, no es realmente un selector como tal.

De todas formas, ese zoom siguiendo a la posición del ratón no podrás hacerlo con CSS, tendrás que usar JavaScript para eso. Si quieres te movemos el tema a ese foro.
  #4 (permalink)  
Antiguo 12/09/2013, 16:58
Avatar de mdromed  
Fecha de Ingreso: septiembre-2009
Mensajes: 389
Antigüedad: 12 años, 11 meses
Puntos: 8
Respuesta: Hacer hover sobre la capa de debajo cuando hay dos capas solapadas

Lo del raton esta hecho con jquery.
Yo lo q quiero es q al hacer click se active el evento de la capa de debajo aunque haya otra capa encima.
Se puede hacer eso?
  #5 (permalink)  
Antiguo 13/09/2013, 04:25
 
Fecha de Ingreso: agosto-2013
Mensajes: 46
Antigüedad: 9 años
Puntos: 12
Respuesta: Hacer hover sobre la capa de debajo cuando hay dos capas solapadas

Pointer-events: none

[URL="http://www.w3.org/TR/SVG/interact.html#PointerEventsProperty"]
La especificación[/URL]
[URL="http://ksesocss.blogspot.com/2012/04/pointer-events-los-elementos-juegan-al.html"]En español[/URL]
  #6 (permalink)  
Antiguo 13/09/2013, 15:29
Avatar de mdromed  
Fecha de Ingreso: septiembre-2009
Mensajes: 389
Antigüedad: 12 años, 11 meses
Puntos: 8
Respuesta: Hacer hover sobre la capa de debajo cuando hay dos capas solapadas

Cita:
Iniciado por faillure Ver Mensaje
Pointer-events: none

[URL="http://www.w3.org/TR/SVG/interact.html#PointerEventsProperty"]
La especificación[/URL]
[URL="http://ksesocss.blogspot.com/2012/04/pointer-events-los-elementos-juegan-al.html"]En español[/URL]

PERFECTO!!!!! Eso es justo lo que queria!!!!

Lo malo es que en algunas versiones de IE no funciona

¿Algun hack para q funcione?

Graciasssss!

Etiquetas: hover, z-index
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 22:54.