Skip to content

Instantly share code, notes, and snippets.

@aerickson

aerickson/resize image while maintaining aspect ratio

Created March 1, 2011 22:10
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save aerickson/849990 to your computer and use it in GitHub Desktop.
Save aerickson/849990 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
resize image while maintaining aspect ratio
<html>
<head>
<title>Image</title>
<script type="text/javascript">
function resizeImage()
{
var window_height = document.body.clientHeight
var window_width = document.body.clientWidth
var image_width = document.images[0].width
var image_height = document.images[0].height
var height_ratio = image_height / window_height
var width_ratio = image_width / window_width
if (height_ratio > width_ratio)
{
document.images[0].style.width = "auto"
document.images[0].style.height = "100%"
}
else
{
document.images[0].style.width = "100%"
document.images[0].style.height = "auto"
}
}
</script>
<body onresize="resizeImage()">
<center><img onload="resizeImage()" margin="0" border="0" src="MyImage.jpg"></center>
</body>
</head>
</html>
@aerickson
Copy link
Author

from http://www.dynamicdrive.com/forums/showthread.php?t=28888

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment