Hola amiguetes... Tengo un problemón con una función en el portfolio de una pagina web. La web está todavía en pleno desarrollo, este es el enlace cervantesbernal.com
Si os vais a portfolio, vereis unas imagenes en miniaturas a la izquierda. Lo que quiero hacer es que al pasar el ratón sobre la miniatura, aparezca la imagen en grande a la derecha, también aparezca un texto en el div que hay encima y dicha miniatura cambie (si os fijais sale una pequeña rayita roja encima--- un rollover).
Utilizé MM_swapImage. En principio lo de la imagen en grande a la derecha, y la variación de la miniatura (como vereis en la web) está resuelta... Mis dos problemas son que al pulsar la siguiente miniatura, la miniatura primera no vuelve a su opción inicial y sigue con la rayita. El tema es que cambien tanto la miniatura y la imagen grande a la vez, y vuelvan a su posición la dos a la vez al pasar a otra miniatura.
El segundo problama (por ahora) que se me plantea es que el texto que aparece encima de la miniaturas que está en div independiente también debería de cambiar a la vez que las otras dos imágenes (observar la imagen que adjunto, que es como debería quedar). ¿Como soluciono el tema? Muchísimas gracias de antemano, a ver si alguien me puede ayudar, que está la cosa mu malita!!!! gracias.
Os pongo el html:
<script src="../ilustracion/Scripts/AC_RunActiveContent.js" type="text/javascript"></script>
<script type="text/javascript">
function MM_openBrWindow(theURL,winName,features) { //v2.0
window.open(theURL,winName,features);
}
</script>
<script type="text/javascript">
<!--
<!--
function MM_reloadPage(init) { //reloads the window if Nav4 resized
if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) {
document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }}
else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload();
}
MM_reloadPage(true);
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[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&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[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].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[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>
<link href="../../css/generalestilos.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div class="contenedor">
<!--cabecera-->
<div class="cabecera">
</div>
<!--menu-->
<ul class="menu">
<li class="menu_1-estudio"> <a href="../../index.html""> </a> </li>
<li class="menu_2-portfolio"> <a href="../ilustracion/paginas/portfolio/index.html"> </a></li>
<li class="menu_1-ilustracion"> <a href="../ilustracion/index.html"> </a></li>
<li class="menu_1-multimedia"> <a href="../multimedia/index.html"> </a></li>
</ul>
<!--cuadrotrabajo-->
<div class="recuadro">
<ul class="submenu">
<li class="submenu_2-editorial"> <a href="index.html"> </a> </li>
<li class="submenu_1-grafico"> <a href="grafico.html"> </a> </li>
<li class="submenu_1-identidad"> <a href="identidad.html"> </a> </li>
<li class="submenu_1-packaging"> <a href="packaging.html"> </a> </li>
</ul>
<!--foto grande-->
<div class="foto-grande"><img src="../../img/portfolio/foto-grande_1.gif" alt="Viento" name="foto-grande" border="0" id="foto-grande" /></div>
<!--textos foto-->
<div class="txtportfolio">
</div>
<!--miniaturas fotos-->
<div class="foto-mini">
<div class="foto-mini_1"><img src="../../img/portfolio/foto-mini_1off.gif" alt="Viento" name="foto-mini_1" border="0" id="foto-mini_1" width="34" height="36" onmouseup="MM_swapImage('foto-grande','','../../img/portfolio/foto-grande_1.gif','foto-mini_1','','../../img/portfolio/foto-mini_1on.gif',1)" /></div>
<div class="foto-mini_2"><img src="../../img/portfolio/foto-mini_2off.gif" alt="Colegio Médico" width="34" height="36" onmouseup="MM_swapImage('foto-grande','','../../img/portfolio/foto-grande_2.gif',1)" /></div>
<div class="foto-mini_3"><img src="../../img/portfolio/foto-mini_3off.gif" alt="Juan Duarte Martín" width="34" height="36" onmouseup="MM_swapImage('foto-grande','','../../img/portfolio/foto-grande_3.gif',1)" /></div>
</div>
</div>
</div>
</body>
</html>
