Tengo un problema con CSS que me pasa habitualmente y quiero ver si existe alguna solución para no estar haciendo chapuzas todo el tiempo.
El escenario se puede ver en la siguiente imagen:
http://subefotos.com/ver/?740d8e1060...69fd7ad6fo.jpg
Tengo varias capas con imágenes, junto con ellas va una "nota" con información sobre la imagen y quiero que se muestre cuando paso el ratón por encima de ellas, hasta aquí sería utilizar un display:"none" y un display:"block" y resuelto el problema.
Pero como me gustaría dejar todo un poco bonito en vez de eso juego con la "opacity" para poder utilizar transacciones y que se haga la nota opaca en 0.2 segundos, el problema de todo esto es que las capas están todo el tiempo activas, por lo que me molestan al pasar el ratón por encima de las imágenes. Ya que al pasar el ratón por encima de la nota invisible de la capa de al lado, la nota de la imagen por la que estoy pasando el ratón desparece, ya que ya no estamos sobre la imagen, si no que estamos sobre la nota transparente que tiene encima.
Como esto me pasa habitualmente cuando hago transacciones e intento que el código quede lo más limpio posible, me gustaría saber si existe alguna propiedad qu hiciese que el ratón "pase" de la imagen de encima y siga estando "hover" la imagen que tiene debajo. En resumen, que la capa solo se muestre sin intervenir con el cursor, y que sigamos estando sobre la imagen de debajo, incluso si hiciésemos clic, afectase al contenido de debajo de la capa que "no interfiere con el ratón".
Demasiada explicación para un problema que espero que sea simple jeje.
Gracias por las respuestas.
