• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 730
  • Last Modified:

How do i get the image dimension from the image URL? -

Hi There,
Any one here know how to get the image width and height from the URL. That is i need the image width and height when it loading in the browser. So i can adjust the image size with respect to the  original dimension when it display on the browser . any help would be greatly apppriciated
0
palanee83
Asked:
palanee83
1 Solution
 
MorcalavinCommented:
You can't get the width and height of the image just from the url(without some type of server side scripting).  The image would have to be loaded somewhere before you can tell how big it is.

However, you can load it in an absolute, hidden div and use offsetWidth/height to get the size of it.  This  is a quick example of how to get the image size, without actually showing the image.  You can add javascript to resize the image later or whatever.(tonberry.gif is a file of mine that is 339x300)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<script type="text/javascript">
 
</script>
<style type="text/css">
	#imageloader
	{
		visibility: hidden;
		position:absolute;
	}
</style>
<title>Untitled Document</title>
</head>
 
<body>
<div><input type="button" value="Get Image Size" onclick="alert(document.getElementById('image').offsetWidth + 'x' + document.getElementById('image').offsetHeight) " /></div>
<div id="imageloader"><img id="image" src="tonberry.gif"></div>
</body>
</html>

Open in new window

0

Featured Post

Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Tackle projects and never again get stuck behind a technical roadblock.
Join Now