Formulario Muestra Imágenes
Este código crea un formulario que muestran imágenes y texto sobre dicha imagen.
|
Ejemplo
|
|
Copia y Pega el código como "Pegado especial" como "Tratar como HTML" en la vista Normal
<table border="1" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#111111" width="100%" id="AutoNumber1" height="19%">
<tr>
<td width="100%" height="19%">
<form name="dynamicselector">
<table border="0" cellspacing="0" cellpadding="20" style="border-collapse: collapse" bordercolor="#111111" width="100%" height="182">
<tr>
<td width="136" align="center" height="182">
<select name="dynamicselector2" size="11" onChange="generateimage(this.options[this.selectedIndex].value)">
<option value="http://elcharcoazul.es.tl/imagen.gif" selected>
La Tienda Virtual
</option>
<option value="http://elcharcoazul.es.tl/imagen2.gif">
Juegos en Red
</option>
<option value="elcharcoazul.es.tl/imagen3.gif">
Trucos de Juegos
</option>
</select></td>
<td width="86%" align="left" height="182">
<ilayer id="dynamic1" width="100%" height="178">
<layer id="dynamic2" width="100%" height="178">
<div id="dynamic3">
</div>
</layer>
</ilayer>
</td>
</tr>
</table>
</form>
<script>
//enter image descriptions ("" for blank)
var description=new Array()
description[0]="111111 bienvenidos."
description[1]="222222 recomenda esta web."
description[2]="333333 agrega elcharcoazul a tus favoritos."
var ie4=document.all
var ns6=document.getElementById
var tempobj=document.dynamicselector.dynamicselector2
if (ie4||ns6)
var contentobj=document.getElementById? document.getElementById("dynamic3"): document.all.dynamic3
function generateimage(which){
if (ie4||ns6){
contentobj.innerHTML='<center>Loading image...</center>'
contentobj.innerHTML='<center><img src="'+which+'"><br><br>'+description[tempobj.options.selectedIndex]+'</center>'
}
else if (document.layers){
document.dynamic1.document.dynamic2.document.write('<center><img src="'+which+'"><br><br>'+description[tempobj.options.selectedIndex]+'</center>')
document.dynamic1.document.dynamic2.document.close()
}
else
alert('You need NS 4+ or IE 4+ to view the images!')
}
function generatedefault(){
generateimage(tempobj.options[tempobj.options.selectedIndex].value)
}
if (ie4||ns6||document.layers){
if (tempobj.options.selectedIndex!=-1){
if (ns6)
generatedefault()
else
window.onload=generatedefault
}
}
</script>
</td>
</tr>
</table>
Entra en las propiedades del formulario haciendo doble clic sobre el y modificas las imágenes así como el texto de título sobre ellas. El texto informativo debajo de la imagen lo podrás modificar dentro del código en la vista HTML