Problema al mostrar imagenes desde una base de datos

[Alexis88]

Eso lo haría con un poco de jQuery, algo de CSS, un Div y un elemento Img, ambos ocultos. En el mismo documento en donde está la tabla con las filas de 6 imágenes, coloca los dos elementos ocultos después de la tabla:

Código HTML:

<div id = "fondo"></div>
<img id = "imagen" />
 

Ahora, aplico estilos al Div y al Img:

Código CSS:

#fondo, #imagen{
    display: none;
    position: absolute;
}
 
#fondo{
    background: rgba(0, 0, 0, 0.75);
    top: 0;
    left: 0;
    z-index: 1000;
}
 
#imagen{
    width: 20em;
    height: 15em;
    margin: -7.5em 0 0 -10em;
    top: 50%;
    left: 50%;
    z-index: 2000;
    background: #fff;
}
 
img:hover{
    cursor: pointer;
}
 

Y con jQuery, mostraremos las imágenes al darle un clic a cada una de ellas:

Código Javascript:

$("img").click(function(e){
    e.preventDefault();
    var ancho = $(window).width() * 2;
        alto = $(window).height() * 2;
 
    $("#fondo").css({
        "width": ancho,
        "height": alto
    });
 
    $("body").css("overflow", "hidden");
 
    $("#imagen").prop("src", $(this).prop("src"));
 
    $("#fondo, #imagen").fadeIn(1500);
});
 
$("#fondo").click(function(){
    $("#fondo, #imagen").fadeOut(1500);
    $("body").css("overflow", "auto");
});
 

Así es como se ve: http://jsbin.com/aSUnOwut/2

Para cerrar la imagen emergente y el fondo, solamente dale un clic al fondo. Con esto, los enlaces que le asignas a cada imagen, quedan sobrando.

Saludos