Estimados tengo este diseño que me debería permitir ir cambiando la imagen central cada vez que se haga click en cada la miniatura.
les dejo el link de la página de prueba:
test_02.html
pero no me resulta, no se que estoy haciendo mal....
aca está el código que estoy usando
Código HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<script language="JavaScript" type="text/JavaScript">
<!--
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a.indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a;}}
}
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a)&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers.document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}
function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>
</head>
<body>
<a href="javascript:;" onClick="MM_swapImage('img_gra','','img/test1.gif',1)"><img src="img/pequetest1.gif" name="img_peq_01" border="0" id="img_peq_01"></a>
<a href="javascript:;" onClick="MM_swapImage('img_gra','','img/test2.gif',1)"><img src="img/pequetest2.gif" name="img_peq_02" border="0" id="img_peq_02"></a>
<a href="javascript:;" onClick="MM_swapImage('img_gra','','img/test3.gif',1)"><img src="img/pequetest3.gif" name="img_peq_03" border="0" id="img_peq_03"></a>
<br>
<br>
<br>
<img src="img/test1.gif" name="img_gra" id="img_gra">
</body>
</html> alguien que sepa como arreglar esto?
gracias.