Buen dia, estoy realizando una galería de fotos en php utilizando lightbox cuando despliego las imágenes de forma estática no hay problema me las despliegue y hace el efecto de agrandarlas cuando le das click a cada una de ellas.
html>
<head>
<link rel="stylesheet" type="text/css" href="style.css">
<!--<link rel="stylesheet" type="text/css" href="jquery.lightbox.css">-->
<script src="jquery.js" type="text/javascript"></script>
<script src="jquery.lightbox.min.js" type="text/javascript"></script>
<!--<script src="jquery.1.2.3.js" type="text/javascript"></script>-->
<script src="scripts.js" type="text/javascript"></script>
<!-- <script src="jquery-lightbox.js" type="text/javascript"></script>-->
</head>
<body>
<div id="wizards">
<ul>
<li><a href="imagen1.jpg"><img src="imagen1-sm.jpg" alt="Dumbledore" /></a></li>
<li><a href="imagen2.jpg"><img src="imagen2-sm.jpg" alt="Merlin" /></a></li>
<li><a href="imagen3.jpg"><img src="imagen3-sm.jpg" alt="Gandalf" /></a></li>
<li><a href="imagen4.jpg"><img src="imagen4-sm.jpg" alt="Harry Potter" /></a></li>
</ul>
</div>
</body>
</html>
hasta aqui todo bien.
Pero cuando utilizo bases de datos (mysql) o atravéz de jalarlo de un directorio con las fotos me despliega pero no realiza el efecto de agrandar las imágenes cuando le haces click a cada una de ellas se queda pensando.
<?php
include("conexion.php");
$sql=mysql_query("SELECT * FROM FOTOS");
//$result = mysql_query($sql);
$numero = mysql_num_rows($sql);
echo "result:".$numero.'<br>';
$x=1;
while($res=mysql_fetch_array($sql))
{
?>
<div id="wizards">
<ul>
<li><a href="images/imagen1.jpg"><?php echo '<img src="'.$res["FOTO"].'" width="150" height="100">';?></a></li>
<?php
$x++;
if(!($x%5)){ //si al dividir $x entre 5 da cero
echo "<br/>";//colocar un salto de linea
}
}
?>
</ul>
</div>
//observación si lo pongo asi <a href="images/imagen1.jpg"><?php echo '<img src="'.$res["FOTO"].'" width="150" height="100">';?></a></li> en esta primera parte me despliega las fotos pero el efecto de agrandar solo con la primera foto
si lo pongo asi <a href="<?php echo '<img src="'.$res["FOTO"].'" >';?>"><?php echo '<img src="'.$res["FOTO"].'" width="150" height="100">';?></a></li>
me despliega las fotos pero el efecto de agrandar no funciona se queda pensando.
-------------------------------------------------------------------------------------------------
si lo hago atravéz de jalar de un directorio:
<div id="wizards">
<?php
$directory="img2";
$dirint = dir($directory);
while (($archivo = $dirint->read()) !== false)
{
if (@eregi("gif", $archivo) || @eregi("jpg", $archivo) || @eregi("png", $archivo)){ ?>
<ul>
<li><a href="img2/bura1.jpg"><?php echo '<img src="'.$directory."/".$archivo.'" width="150" height="100">';?></a></li>
<!--<li><a href="<?php// echo '<img src="'.$directory."/".$archivo.'">';?>-->
</ul>
<?php
}
//$x++;
}
$dirint->close();
?>
</div>
Observación: en esta parte <li><a href="img2/bura1.jpg"><?php echo '<img src="'.$directory."/".$archivo.'" width="150" height="100">';?></a></li>
Me despliega las fotos y solo agranda la primera
y como lo necesito:
<?php
$directory="img2";
$dirint = dir($directory);
while (($archivo = $dirint->read()) !== false)
{
if (@eregi("gif", $archivo) || @eregi("jpg", $archivo) || @eregi("png", $archivo)){ ?>
<ul>
<li><?php echo '<img src="'.$directory."/".$archivo.'">';?><?php echo '<img src="'.$directory."/".$archivo.'" width="150" height="100">';?></a></li>
</ul>
<?php
}
//$x++;
}
$dirint->close();
Observacion: despliega las fotos pero no agranda cuando le haces click se queda pensando qué me falta o sobre o que estoy haciendo mal cualquier soporte se los
agradeceré.