Hola
He buscado por internet un código para al situar el puntero por encima de la imagen, esta se amplie. Funciona bien, lo que pasa, es que al ampliarse la imagen, parte de la imagen ampliada queda detrás de la imagen todavía pequeña que hay en la fila de la derecha. El caso es que por más que pruebo, no sé que parte del código tocar para solucionarlo.
El código es este:
Código HTML:
</head>
<style type='text/css'>
.thumbnail{position: relative; z-index: 0;}
.thumbnail:hover{ background-color: transparent;z-index: 50;}
.thumbnail span{ /*CSS for enlarged image*/
position: absolute;padding: 5px;left: -100px;border: 0px dashed gray;
visibility: hidden;color: #FFFF00;text-decoration: none;z-index: 0;}
.thumbnail span img{ /*CSS for enlarged image*/border-width: 0;padding: 2px;}
.thumbnail:hover span{ /*CSS for enlarged image on hover*/
visibility: visible;top: 0;left: 10px; /*position where enlarged image should offset horizontally */}
</style>
<body>
<table>
<tr>
<td>
<a class="thumbnail" style="cursor: move;"><img style="width: 141px; height: 141px;" src="images/klematis_small.jpg" border="0" /><span><img style="width: 450px; height: 450px;;" src="images/klematis_small.jpg" /></span></a>
</td>
<td>
<a class="thumbnail" style="cursor: move;"><img style="width: 141px; height: 141px;" src="images/klematis4_small.jpg" border="0" /><span><img style="width: 450px; height: 450px;" src="images/klematis4_small.jpg" /></span></a>
</td>
</tr>
</table>
</body> Así es como queda, como veis parte de la imagen grande, es ocultada por la imagen todavía pequeña de la columna de la derecha.
