Foros del Web » Creando para Internet » HTML »

Distintas formas para hacer una galeria de imagenes en HTML

Estas en el tema de Distintas formas para hacer una galeria de imagenes en HTML en el foro de HTML en Foros del Web. Yo quiero hacer una galeria de imagenes en HTML. Imagino que la manera normal seria haciendo una tabla asi, de preferencia con borde cero: <HTML> ...
  #1 (permalink)  
Antiguo 13/08/2004, 22:58
 
Fecha de Ingreso: julio-2004
Mensajes: 194
Antigüedad: 19 años, 8 meses
Puntos: 0
Distintas formas para hacer una galeria de imagenes en HTML

Yo quiero hacer una galeria de imagenes en HTML. Imagino que la manera normal seria haciendo una tabla asi, de preferencia con borde cero:

<HTML>
<HEAD>
<TITLE>Ejemplo 10</TITLE>
</HEAD>
<BODY>

<H1>Tablas b&aacute;sicas</H1>

<TABLE BORDER="0">
<TR>
<TH>imagen 1</TH>
<TH>imagen 2</TH>
<TH>imagen 3</TH>
</TR>
<TR>
<TD>imagen 1</TD>
<TD>imagen 2</TD>
<TD>imagen 3</TD>
</TR>
<TR>
<TD>imagen 4</TD>
<TD>imagen 5</TD>
<TD>imagen 6</TD>
</TR>
</TABLE>

</BODY>
</HTML>

Y adentro de los TD se pondria una imagen, a la que se le daria cierto tamaño:

<IMG SRC="http://www.tonamelt.com/Tona%20Fan%20Art/Tonamelt%2019.jpg" height="110" width="75">

Y para hacer que se abra en una nueva ventana, se pondria en hipervinculo con la funcion target.

<a href="http://www.tonamelt.com/Tona%20Fan%20Art/Tonamelt%2019.jpg" target="_blank">
<img src="http://www.tonamelt.com/Tona%20Fan%20Art/Tonamelt%2019.jpg" height="110" width="75" border="0"></a>

Okay, pero si yo quiero que la ventana que se abra con la imagen, sea una pop-up del mismo tamaño que la imagen. Como le anexaria el javascript que vi en su pagina en el html???

link: http://www.forosdelweb.com/post266570

<script language="javascript">

//script por Tunait
var ventana
var cont=0
var titulopordefecto = "Perico de los palotes" //texto por defecto a mostrar en la barra de título en caso de omitir el argumento titulo

function afoto(cual,titulo)
{
if(cont==1){ventana.close();ventana=null}
if(titulo==null){titulo=titulopordefecto}
ventana=window.open('','ventana','resizable=yes,sc rollbars=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>

Se me complica el mezclar el html de la galeria de imagenes, con tu javascript de la pop-up del tamaño de la imagen. Pero imagino que asi quedaria mas cool.
  #2 (permalink)  
Antiguo 14/08/2004, 03:45
Avatar de tunait
Moderadora
 
Fecha de Ingreso: agosto-2001
Ubicación: Terok Nor
Mensajes: 16.805
Antigüedad: 22 años, 7 meses
Puntos: 381
Hola Alex,

Mira, en base a la línea de ejemplo que dejas, habrías de hacerlo así

<a href="http://www.tonamelt.com/Tona%20Fan%20Art/Tonamelt%2019.jpg" target="_blank" onclick="afoto('http://www.tonamelt.com/Tona%20Fan%20Art/Tonamelt%2019.jpg')">
<img src="http://www.tonamelt.com/Tona%20Fan%20Art/Tonamelt%2019.jpg" height="110" width="75" border="0"></a>

En el caso de que quieras añadir un t´titlo distinto para cada imagen que se abra puedes añadirlo a continuación de la ruta de la imagen

<a href="http://www.tonamelt.com/Tona%20Fan%20Art/Tonamelt%2019.jpg" target="_blank" onclick="afoto('http://www.tonamelt.com/Tona%20Fan%20Art/Tonamelt%2019.jpg','El titulo que quieras')">
<img src="http://www.tonamelt.com/Tona%20Fan%20Art/Tonamelt%2019.jpg" height="110" width="75" border="0"></a>

  #3 (permalink)  
Antiguo 16/08/2004, 01:53
 
Fecha de Ingreso: julio-2004
Mensajes: 194
Antigüedad: 19 años, 8 meses
Puntos: 0
Gracias tunait, voy a probar el script
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 15:48.