[SOLUCIONADO] Problema con link sobre transición

[HaroldTemple]

Hola de nuevo, vamos allá con un duda.

He hecho una galería y cada imagen tiene que hacer link a una web, hasta aquí todo correcto, el caso es que al pasar el ratón hay una transición y no me hace link por que realmente no pasa el puntero por encima de la foto. No se si me explico. En la imagen se ve un una lupa y un icono de enlace pero lo que yo quiero es que tambien te linkee dándole a cualquier lugar.



Este es código CSS:

Código CSS:

.mega-hover                         {   width:100%;height:100%;position:absolute; background: url("../assets/grain.png") repeat; background-color:rgba(0,0,0,0.8);
                                            border-radius:4px; -moz-border-radius:4px; -webkit-border-radius:4px;
                                            -webkit-transition: all 0.2s ease-out;
                                            -moz-transition: all 0.2s ease-out;
                                            -o-transition: all 0.2s ease-out;
                                            -ms-transition: all 0.2s ease-out;
                                            -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
                                             filter: alpha(opacity=0);
                                            -moz-opacity: 0;
                                            -khtml-opacity: 0;
                                            opacity: 0;
                                        }
 

Y este es el código HTML:

Código HTML:

<div class="megafolio-container light-bg-entries">
                        <div class="mega-entry cat-one cat-all" data-src="http://www.betatest.es/AVpics/Cuadrado-01.jpg" data-width="577" data-height="500">
                                <div class="mega-hover">
                                        <div class="mega-hovertitle">Jocs d’infants<div class="mega-hoversubtitle">Diseño editorial</div></div>
                                        
                                        <a class="fancybox" rel="group" href="http://www.betatest.es/Galeria01/galeria01.html"><div class="mega-hoverlink"></div></a>
                                        <a class="fancybox" rel="group" href="http://www.betatest.es/AVpics/Cuadrado-01.jpg"><div class="mega-hoverview"></div></a>
 
                                </div>
 

Muchas gracias de antemano.

[osobuco]

pon un <a> transparente encima que mida y este posicionado igual que la imagen con un z-index superior que el de la lupa y que este también tenga enlace , así a lo rápido tampoco e visto la galería pon tu enlace para que podamos ayudarte mas.

[osobuco]

viendo tu web te recomiendo lo siguiente:

Código HTML:

<div class="mega-hover"  onclick="location.href='http://www.tuenlace.en'">
                                        <div class="mega-hovertitle">Coleción Paideia<div class="mega-hoversubtitle">Diseño editorial</div></div>
 
                                        <a class="fancybox" rel="group" href="http://www.betatest.es/Galeria05/galeria05.html"><div class="mega-hoverlink"></div></a>
                                        <a class="fancybox" rel="group" href="http://www.betatest.es/AVpics/Cuadrado-10.jpg"><div class="mega-hoverview"></div></a>
                                </div>
 

onclick="location.href='http://www.tuenlace.en'"

[HaroldTemple]

Osobuco muchas gracias maestro.

[osobuco]

Iniciado por HaroldTemple

Osobuco muchas gracias maestro.

me alegro que te fuera util