Que tal amigos del foro, estoy trabajando en un sitio web, más concretamente estoy haciendo el cambio de html a un sitio dinamico con php y mysql todo iba bien hasta ahora que me surgio este problema que talvez sea una tonteria pero que no he podido resolver.
Para mostrar una serie de imagenes de un producto cualquiera en la version de la pagina en html usaba el siguiente codigo javascript
Código:
<script language="javascript">
/*****************************************************************************
Pop-up ajustada a foto. ******************************************************************************/
var titulopordefecto = "IMAGEN"; //Si no se especifica un título al llamar a la función colocará el que se especifique aquí
var ventana;
var cont=0;
function afoto(cual,titulo)
{
if(cont==1){ventana.close();ventana=null}
if(titulo==null){titulo=titulopordefecto}
ventana=window.open('','ventana','resizable=yes,scrollbars=no')
ventana.document.write('<html><head><title>' + titulo + '</title></head><body style="overflow:hidden" marginwidth="0" marginheight="0" topmargin="0" bottommargin="0" leftmargin="0" rightmargin="0" scroll="no" onUnload="opener.cont=0"><img src="' + cual + '" onLoad="opener.redimensionar(this.width, this.height)">');
ventana.document.close();
cont++;
}
function redimensionar(ancho, alto)
{
ventana.resizeTo(ancho+12,alto+28);
ventana.moveTo((screen.width-ancho)/2,(screen.height-alto)/2); //centra la ventana. Eliminar si no se quiere centrar el popup
}
</script>
Lo que hace este script es que al clickear sobre el thumbnail se abra la imagen original en una ventana popup que se ajusta al tamaño de la imagen.
El codigo de las tablas que contienen los thumbnails desde los cuales se llama al script es el siguiente:
Código:
<table width="120" height="90" border="1" align="center" bordercolor="#99B1D1" bgcolor="#FFFFFF">
<tr>
<td>
<div align="center"><a href="#" onClick="afoto('../fotos/imagen1.jpg','');return false"><img src="thumbnails/thumb_imagen1.jpg" width="120" height="90" border="0"></a></div>
</td>
<td>
<div align="center"><a href="#" onClick="afoto('../fotos/imagen2.jpg');return false"><img src="thumbnails/thumb_imagen2.jpg" width="120" height="90" border="0"></a></div>
</td>
<td>
<div align="center"><a href="#" onClick="afoto('../fotos/imagen3.jpg');return false"><img src="thumbnails/thumb_imagen3.jpg" width="120" height="90" border="0"></a></div>
</td>
<td >
<div align="center"><a href="#" onClick="afoto('../fotos/imagen4.jpg');return false"><img src="thumbnails/thumb_imagen4.jpg" width="120" height="90" border="0"></a></div>
</td>
</tr>
</table>
Pero tenia que colocar el nombre de cada imagen y de su thumbnail manualmente y ya se imaginaran lo complicado y tedioso que se vuelve si hay muchos productos
Ahora almaceno los nombres de las imagenes en la base de datos en un campo de tipo texto, les pongo los codigos que utilice para que se entienda mejor de donde sale cada variable y asi de paso pueda usarlo quien los necesite
Código:
//parte del codigo del formulario que uso para enviar las imagenes
//a un directorio y sus nombres a la base y otros datos de el producto,
//se usa un campo type=file
//para cada imagen o sea que podemos enviar la cantidad de imagenes que
//necesitemos
<input type=file name="images[]"> <br>
</td>
</tr>
<tr><td> </td>
<td><input type="submit" name="s1" value="Enviar"></td>
Para guardar las imagenes y alamcenar sus nombres se usa el siguiente codigo
Código:
if(isset($_POST[s1]))
{
if(!empty($_FILES[images][name][0]))
{
while(list($key,$value) = each($_FILES[images][name]))
{
if(!empty($value))
{ //se renombra cada imagen y se envia al directorio: fotos
$NewImageName = $t."_pic_".$value;
copy($_FILES[images][tmp_name][$key], "../fotos/".$NewImageName);
$MyImages[] = $NewImageName;
}
}
if(!empty($MyImages))
{ //Se almacenan los nombres de todas las imagenes
//relacionadas con un producto especifico en esta variable
$ImageStr = implode("|", $MyImages);
}
}
}
//y se guarda en la base la variable que contiene los nombres de las imagenes
//junto con algun otro dato enviado por el formulario
$sql = "insert into TABLA set
marca = '$_POST[marca]',
modelo = '$_POST[modelo]',
image = '$ImageStr' ";
//el contenido de la variable $ImageStr seria algo como
//nombreprimeraimagen|nombresegundaimagen|nombreterceraimagen
//asi con todos los nombres de las imagenes
Para mostrar las imagenes en una tabla de cinco celdas por fila que se genera conforme se recuperan de la base con el siguiente codigo
Código:
if(!empty($_GET[id]))
{ //id de un producto especifico que se obtiene de una busqueda
// por marca o modelo
$sql1="SELECT * FROM tabla WHERE id='$_GET[id]'";
$sql2=mysql_query($sql1);
$row=mysql_fetch_array($sql2);
$cont=1; //variable que sirve para verificar si abro o cierron un renglon
echo"<table border='0' align='center' >";
if(!empty($row[image]))
{
$MyImages=explode("|",$row[image]);
while(list(,$v)=each($MyImages))
{
$thumb="<img src=\"re_images/$v\" width=110 height=83 border='0' >";
$normal="<img src=\"re_images/$v\" width=600 height=450 border='0' >";
if(($cont%5)==1)
{ //Abre el renglon de celdas
echo"<tr>";
}
echo"<td>";
echo"<td ><div align='center'>$thumb</div></td>"; <--AQUI
echo"</td>";
if(($cont%5)==0)
{//cierra el renglon
echo"</tr>";
}
$cont++;
}
}
echo"</table>";
}
El problema es que solo me muestran los thumbnails de las imagenes y no se como llamar al javascript con las variables $thumb y $normal intente en
lugar de
Código:
echo"<td ><div align='center'>$thumb</div></td>";
por
Código:
<td>
<div align="center"><a href="#" onClick="afoto('$normal');return false">$thumb</a></div>
</td>
y obtuve el error:
Parse error: parse error, unexpected T_STRING, expecting ',' or ';' in d:\appserv\www\......\info.php on line 170
que es la linea donde hice la sustitucion
Siento haberme extendido pero era necesario creo yo para que sea un poco mas facil de entender