Resize Image (keeping aspect ratio) of HTML with Javascript

resize-image.js

// jquery required
// maxWidth and maxHeight can be parameters for more flexibility

function (img_ref) { 
    var img = $(img_ref);
    img.on('load', function () {
	
	img.css("width", "auto");
	img.css("height", "auto");
	
	var maxWidth = 180; // Max width for the image
	var maxHeight = 180;    // Max height for the image
	var ratio = 0;  // Used for aspect ratio
	var width = img.width();    // Current image width
	var height = img.height();  // Current image height

	if (width > maxWidth && width > height) {
	    
	    ratio = width / height;
	    img.css("height", maxWidth/ratio);
	    img.css("width", maxWidth); // Set new width

	}else  if (height > maxHeight && height > width){
	    
	    ratio = height / width;
	    img.css("width", maxHeight/ratio);
	    img.css("height", maxHeight);
	}else {

	    img.css("width", maxWidth);
	    img.css("height", maxHeight);
	}
	
    });
}