Muchas gracias, funciono perfecto :)
Pero al avanzar un poco mas me tope con un inconveniente, para lo que estoy tratando de hacer necesito que la id pase de una miniatura a otra al hacerle click
Este es mi codigo, espero que alguien me pueda dar una ayuda :)
Código HTML:
<html>
<head>
<style type="text/css">
.currentThumbPagerCell{
border:1px solid #a09d9d;
cursor:pointer;
}
.currentThumbPagerCell img{
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100); /* IE 5.5+*/
-moz-opacity: 1.0; /* Mozilla 1.6- */
-khtml-opacity: 1.0; /* Konqueror 3.1, Safari 1.1 */
opacity: 1.0;
}
.thumbPagerCell{
border:1px solid #dfdcdc;
cursor:pointer;
}
.thumbPagerCell img{
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50); /* IE 5.5+*/
-moz-opacity: 0.5; /* Mozilla 1.6- */
-khtml-opacity: 0.5; /* Konqueror 3.1, Safari 1.1 */
opacity: 0.5;
}
#td_current{
border:1px solid #a09d9d;
cursor:pointer;
}
#td_current img{
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100); /* IE 5.5+*/
-moz-opacity: 1.0; /* Mozilla 1.6- */
-khtml-opacity: 1.0; /* Konqueror 3.1, Safari 1.1 */
opacity: 1.0;
}
</style>
<script language="JavaScript" type="text/javascript">
function changeImage(filename){
document.mainimage.src = filename;
}
function changeId(elem,newId){
return elem.id = newId;
}
</script>
</head>
<body>
<table>
<tr>
<td class="bigFrame">
<img name="mainimage" src="stegmann.dk/mikkel/porta/demo/mies/medium/0005.jpg">
</td>
</tr>
</table>
<table>
<tr>
<td class="thumbPagerCell" onClick="changeImage('stegmann.dk/mikkel/porta/demo/mies/medium/0005.jpg'); changeId(this,'td_current')"><img src="stegmann.dk/mikkel/porta/demo/mies/small/0005.jpg" alt="" border="0" /></td>
<td class="thumbPagerCell" onClick="changeImage('stegmann.dk/mikkel/porta/demo/mies/medium/0007.jpg'); changeId(this,'td_current')"><img src="stegmann.dk/mikkel/porta/demo/mies/small/0007.jpg" alt="" border="0" /></td>
<td class="thumbPagerCell" onClick="changeImage('stegmann.dk/mikkel/porta/demo/mies/medium/0009.jpg'); changeId(this,'td_current')"><img src="stegmann.dk/mikkel/porta/demo/mies/small/0009.jpg" alt="" border="0" /></td>
<td class="thumbPagerCell" onClick="changeImage('stegmann.dk/mikkel/porta/demo/mies/medium/0006.jpg'); changeId(this,'td_current')"><img src="stegmann.dk/mikkel/porta/demo/mies/small/0006.jpg" alt="" border="0" /></td>
</tr>
</table>
</body>
</html>