Ver Mensaje Individual
  #56 (permalink)  
Antiguo 10/12/2002, 08:49
Avatar de tunait
tunait
Moderadora
 
Fecha de Ingreso: agosto-2001
Ubicación: Terok Nor
Mensajes: 16.805
Antigüedad: 23 años, 2 meses
Puntos: 381
pop-up ajustada a imagen versión 2

R. Es una variante que incluye la posibilidad de pasar a la imagen siguiente o a la anterior desde el mismo pop-up

Código PHP:
<script language="javascript">

//Ventana ajustada a foto por tunait

var ventana
//metemos en un array el listado de las imágenes que queramos utilizar en el orden que nos interese

afotos=new Array()
afotos[0]="tibidabo.jpg"
afotos[1]="gato.jpg"
afotos[2]="paloma.jpg"
afotos[3]="perico.jpg"

function afoto(cual)
{
if(
ventana){ventana.close()}
buscar(cual)
ventana=windowopen('','ventana','resize=yes,scrollbars=no,resizable=yes')
ventana.document.write('<body marginwidth="0" marginheight="0" topmargin="0" bottommargin="0" leftmargin="0" rightmargin="0"><img id="foto" alt="mi foto" src="' cual '" onLoad="opener.redimensionar(this.width, this.height)">')
ventana.document.write('<br><div align="center"><a href="#" onClick="if(opener.cont==0){opener.cont=opener.afotos.length-1}else{opener.cont--};document.getElementById(\'foto\').src =opener.afotos[opener.cont];return false">anterior</a>')
ventana.document.write('  |  <a href="#" onClick="if(opener.cont==opener.afotos.length-1){opener.cont=0}else{opener.cont++};document.getElementById(\'foto\').src =opener.afotos[opener.cont];return false">siguiente</a>')
}

var 
cont
function redimensionar(anchoalto)
{
ventana.resizeTo(ancho,alto+50)
}
function 
buscar(que)
{
for(
c=0;c<afotos.length;c++)
{
   if(
afotos[c]==que)
   {
   
contc;
   return 
cont
   
break
  }
}

}
</script> 
... y luego llamamos a cada imagen a través de la función pasándole como argumento el nombre de la imagen:

<body bgcolor="#FFFFFF" text="#000000">
<div align="center"><b onClick="afoto('tibidabo.jpg')">Tibidabo</b> &nbsp;&nbsp;
<b onClick="afoto('gato.jpg')">Gato</b> &nbsp;&nbsp;<b onClick="afoto('paloma.jpg')">Paloma</b>
&nbsp;&nbsp;<b onClick="afoto('perico.jpg')">Perico</b> </div>
</body>