Buenas ... estoy diseñando un sitio que tiene una galería php que muestro las imágenes desde un while y las levanta de una base de datos, el tema es que necesito mostrar la ampliaciòn en un modal jquery y me muestra el primer item, obviamente me faltan conocimientos para poder solucionarlo, me podrían ayudar ? muchas gracias.
Paso el código:
// aca muestro las imagenes segun la categoria, lo hago en cada página según el modelo
$connect = mysql_connect ('localhost','root','');
mysql_select_db ('sitioweb',$connect);
$consulta= "select * FROM productos WHERE id_categorias=2 ORDER BY id DESC";
$query = mysql_query ($consulta,$connect);
$resultado= mysql_query ($consulta,$connect);
y en la galería las saco así:
<?PHP
while ($row = mysql_fetch_assoc($resultado)){
$salida.="<div class='contenedor_imagen_colecciones'>
<a id='#dialogcoleccion' name='modal'>
<img class='imagen_colecciones' src='productos/imagenes_productos/miniaturas/".$row['id'].".jpg'/></a>
<div class='hover_text_colecciones'>
<div class='hover_text_colecciones_content'>".'<h5>'.$r ow['clasificacion'].'</h5>'.'<h6>'.$row['descripcion'].'</br>'.$row['color'].'</br>'.$row['articulo'].'</h6>'."</div></div></div>
<input type='hidden' value='".$row['id']."' name='id'>";
}
echo $salida;
?>
y en el modal, que quiero mostrar un código genérico para todo le paso esto:
<?PHP
//$row = mysql_fetch_assoc($resultado);
//$row = mysql_fetch_assoc($query);
$row = mysql_fetch_assoc($query);
$salida1.="
<img class='dialogcoleccionimg' src='productos/imagenes_productos/".$row['id']."gr.jpg' />
<div class='dialogcolecciontxt'>".'<h5>'.$row['clasificacion'].'</h5>'.'<h6>'.$row['descripcion'].'</br>'.$row['color'].'</br>'.$row['articulo'].'</h6>'."</div>";
echo $salida1;
?>
la función modal es la que nada en la vuelta:
function modal(){
$('[name=modal]').click(function(e) {
e.preventDefault();
var id = $(this).attr('id');
var maskHeight = $(document).height();
var maskWidth = $(window).width();
$('#mask').css({'width':maskWidth,'height':maskHei ght});
$('#mask').fadeIn(800);
$('#mask').fadeOut("slow",0.8);
var winH = $(window).height();
var winW = $(window).width();
$(id).css('top', winH/2-$(id).height()/2);
$(id).css('left', winW/2-$(id).width()/2);
$(id).fadeIn(2000);
});
$('.window .close').click(function (e) {
e.preventDefault();
$('#mask, .window').fadeOut(function(){$('#mask').fadeOut("s low",0.8)});
});
$('#mask').click(function () {
$(this).hide();
$('.window').hide();
});
}
Desde ya muchas gracias y espero respuestra .. .saludos !!