Hace poco tiempo una amiga me comentó su idea acerca de realizar una ampliación de fotos para la web pasando el ratón por encima. En ese momento me acordé de lo que había visto alguna vez en algún sitio. La idea consistía en colocar en la pantalla todas las imágenes, pequeñas y grandes, e ir mostrando la que se considere oportuna usando la propiedad visibility de la hoja de estilos.
Esta noche otro amigo me ha preguntado algo muy similar, pero su idea era la de modificar los atributos de una única imagen. ¿Se podrá? pues va a ser que sí. En unos minutos he sacado esto, y lo que es funcionar, funciona. Pueden probar dejando el cursor del ratón o dispositivo apuntador encima de la imagen y luego sacándolo de la misma.
<html>
<head>
<title>prueba</title>
<script type=»text/javascript»>
function resizeImg(x, y) {
miImagen = document.getElementById(‘imagen’);
miImagen.height = x;
miImagen.width = y;
}
</script>
</head>
<body>
<img src=»imagen.jpg» id=»imagen»
onmouseover=»resizeImg(480, 640);»
onmouseout=»resizeImg(288, 352);» />
</body>
</html>
No hay comentarios en “Redimensionamiento dinámico de imágenes”
noviembre 3rd, 2005 en 15:28
Supongo que esto se puede usar también para hacer barras estilo Mac OS X, no?
noviembre 3rd, 2005 en 08:14
Codigo sencillo pero muy util ;)
noviembre 4th, 2005 en 09:22
Se deja como ejercicio al lector que te curres lo mismo para la barra de flickr que tienes a la derecha, pero tomando la foto en media resolucion en vez de escalar la pequeña ;)
noviembre 8th, 2005 en 10:23
Pues sí funciona! veré si así soluciono los problemas de nuestro blog!
Gracias!
:-)