Hola, necesito que alquien me ayude a vizualizar una imagen (reducida) y proporcionada, pongo entre parentesis reducida porque en caso de que la imagen sea menor que el marco en donde se muestra, ella debe tomar su tamaño original.
Bueno, mediante esta rutina he logrado que ello se haga, pero no se porque extraña razón no funciona con imagenes que no han sido previamente cargadas en el browser, va en realidad lo que se es que cuando creo la imagen (new image) si esta no ha sido previamente visualizada en el browser, sus propiedades 'Width' y 'Height' son igual a cero, y por eso la imagen 'NO SE MUESTRA' o mejor dicho se muestra con alto y ancho igual a cero.
//Aqui va el html y el script
<html>
<head>
<script>
function resizeImage()
{
alert();
photo=document.form1.file1.value;
hm=100; //alto del marco donde se muestra
wm=100;// ancho
I=new Image();
I.src=photo;
document.marco.src=I.src;
hp=I.height; //altura de la foto
wp=I.width;//ancho de la foto
hcm=1/hm; //coeficiente de la altura del marco
wcm=1/wm;//coeficiente del ancho del marco
hcp=hp*hcm; //coeficiente de la altura de la foto, si es mayor a 1 entonces la foto tiene una altura mayor al marco
wcp=wp*wcm; //coeficiente del ancho de la foto, si es mayor a 1 entonces la foto tiene un ancho mayor al marco
//elijo cual de los coeficientes se aplica
if (hcp>wcp) cp=hcp;
else cp=wcp;
// si el coeficiente es mayor a 1 se reduce la imagen
if (cp>1){
hp=hp/cp;
wp=wp/cp;
}
document.marco.height=hp;
document.marco.width=wp;
}
</script>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body bgcolor="#FFFFFF" text="#000000">
<form name="form1" method="post" action="">
<input type="file" name="file1" id="file1"">
<input type="button" name="Button" value="Button" onclick="resizeImage();">
<img name="marco" id="marco" >
</form>
</body>
</html>
Espero haber sido claro, desde ya muchas gracias
