redimensionar imagen a partir de su alto y ancho por defecto

deywibkiss · #1 (**permalink**) 01/10/2011, 19:02

hola he estado intentando un jscript que me redimensione el alto de una imagen sin haber especificado en la etiqueta <img> el width y el height.

lo que pasa es que en mi web hay un formulario que carga una imagen de usuario y de la cual solo ESPECIFICO EL ALTO para que el ancho se ajuste y no se desproporcione la imagen.

entonces si yo dejo el height por ejemplo en unos 70px me funciona perfecto para las imagenes donde el height supera el width. Pero en caso contrario, si el width supera el height (imagenes horizontales) ese 70 aplica pero el formulario donde esta la imagen se desborda y hace ver mal la web.

luego intento con un codigo mas o menos asi:

Código Javascript:

Ver originalfunction redim (){  
var alto = document.getElementById("fotouser").height;
var ancho = document.getElementById("fotouser").width;
var height = parseInt(alto);
var width = parseInt(ancho);
if (height < width){
 
document.getElementById("fotouser").style.height = 40 + "%";
}
else
{
document.getElementsById("fotouser").style.height = 20 + "%";   
}
}

pero este codigo necesita que en la etiqueta img se especifique el width y el height cosa que nunca voy a saber ps la imagen es cargada por el usuario.

ayuda.....

KarlanKas · #2 (**permalink**) 02/10/2011, 04:21

Prueba esto!

Código Javascript:

Ver original<html>
<head>
<title>Untitled</title>
</head>
 
<body>
<img />
<script>
foto=new Image();
foto.src="http://www.karlankas.net/carnet2.jpg";
document.images[0].src=foto.src;
document.images[0].onload=function(){
    ancho=foto.width;
    alto=foto.height;
    alert("Medidas de la imagen: \n\n"+ancho+"px X "+alto+"px")
    if (alto < ancho){
        document.images[0].style.height = 40 + "%";
    }
    else
    {
        document.images[0].style.height = 20 + "%";   
    }
}
</script>
 
</body>
</html>

Hugo_Euan · #3 (**permalink**) 02/10/2011, 13:56

Tambien puedes consultar este tema.. para apliar tus criterios sobre la resolución de tu conflicto con JavaScript

http://www.forosdelweb.com/f18/fijar...a-foto-921029/

estoy casi seguro que te será de utilidad...

SALUDOS y ÉXITO.