asked on

how to get image width and height using php or javascript

hello everyone.

i would like to get the width and height of images to be able to display images properly. i used the getimagesize() function of php. but there are instances where this fails. width and height returned are zeroes. now i started to find workarounds.

i placed a javascript onload function in the img tag. to get the width and height of the img, i used imgObj.width and imgObj.height where imgObj is the img object. still, this returned zeroes. now im wondering how to get the proper image width and height.

am i doing wrong here? how do i get the proper image width and height?

spambler

spambler

You'll need the API for the above which is all here:

http://www.aspandjavascript.co.uk/javascript/javascript%5Fapi/

sundaramkumar

a simple way to get the height and width of an image is below

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">
<HTML>
<HEAD>
<TITLE></TITLE>
<script language="javascript">

function getW(){
      var theImg = document.getElementById('testimg');
      alert(theImg.width);
}
function getH(){
      var theImg = document.getElementById('testimg');
      alert(theImg.height);
}

</script>
</HEAD>

<BODY>
<img id="testimg" src="camerabutton_normal.bmp" height="20" width="30" border="0"/>
<input type="button" value="get Width" onclick="getW()"/>
<input type="button" value="get Height" onclick="getH()"/>
</BODY>
</HTML>

gops1

You can try with offset method too. Here is a sample code:

<html>
      <head>
            <title>Script Demo Gops</title>
            <script language="JavaScript">
                  function getOff(o){
                        var o=document.getElementById(o);
                        alert("By Offset:- \nHeight : "+o.offsetHeight +"\nWidth : "+o.offsetWidth);
                  }

                  function getAttribs(o){
                        var o=document.getElementById(o);
                        alert("By Attributes:- \nHeight : "+o.height +"\nWidth : "+o.width);
                  }
            </script>
      </head>
<body>
      <img id="myimg" src="myimage.gif" border="0"/><br>
      <img id="yourimg" src="yourimage.gif" border="0"/><br>
      <input type="button" value="By OffsetMethod" onClick="getOff('myimg')">
      <input type="button" value="By Image Attribs" onClick="getAttribs('yourimg')">
</body>
</html>

sy_geoffrey

ASKER

thanks for the replies.

i am really not interested in getting the width and height of the image per se. but im interested in getting their height and width on or after they load. i have to do this to display the image correctly. if the image width is bigger than that of the height, the image is to be displayed with a width of 100. else, its height will be 90. so this has to be done before the image is displayed.

thanks a lot.

ps: i am yet to try the solution of spambler. thanks spambler if it works.

sy_geoffrey

ASKER

another info that might help is that.

images to be displayed are from the internet. actually everything works well when the user is connected through lan. but when the user is connected via vpn, width and height retrieved is either zero or blank.

thanks a lot for your help.

sundaramkumar

>>>images to be displayed are from the internet. actually everything works well when the user is connected through lan. but when the user is connected via vpn, width and height retrieved is either zero or blank.

this is because the path to the images you have given may be not relative.

sy_geoffrey

ASKER

thanks sundaramkumar.

but the images display. it is just that getimagesize(url) in php returns blank. and that a this.width or even a this.offsetWidth in the onload of the img object does not work as well. they both return 0. and then the image displays afterwards... i just dont get this now.

thanks a lot.

sundaramkumar

in javascript if you want to get an image size try finding the image sizes after the image is loaded.

in php, (from the php manual)
<?php
$size = getimagesize("http://www.example.com/gifs/logo.gif");

// if the file name has space in it, encode it properly
$size = getimagesize("http://www.example.com/gifs/lo%20go.gif");

?>

With JPG images, two extra indexes are returned: channels and bits. channels will be 3 for RGB pictures and 4 for CMYK pictures. bits is the number of bits for each color.

Some formats may contain no image or may contain multiple images. In these cases, getimagesize() might not be able to properly determine the image size. getimagesize() will return zero for width and height in these cases.

Beginning with PHP 4.3.0, getimagesize() also returns an additional parameter, mime, that corresponds with the MIME type of the image. This information can be used to deliver images with correct HTTP Content-type headers

sy_geoffrey

ASKER

here is a sample of the image url

HTTP://AAAAA/BBB/DOCUMENTUM//430/SS010/HL/2007/03/28/HL000000681360-1//NEW/ss010-2007032879383.jpg

i dont know but i really did use getimagesize but it returned blanks...
if it didnt, i wouldnt have resorted to any workaround.

sundaramkumar

this is not a valid url. i cannot see the image with the url you have posted.

try loading the image in a browser with the url you are using. (like http://something.com/somepic.jpg)
if it works then we can look for possible solutions

sy_geoffrey

ASKER

of course you cant see the image in that url... i changed it. AAAAA and BBB is something else. i cant divulge this image though. sorry for that. but yes i can view the image on the browser. nothings wrong with it.

another info that might help. i am using php. and to display the page, i first concatenated everything and ECHOed this concatenated string once. i dont know if that is something...

thanks a lot for your help. it is really appreciated.

ASKER CERTIFIED SOLUTION

sy_geoffrey

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

sy_geoffrey

ASKER

this has already been solved...

thanks a lot for replying...

modus_operandi

Closed, 500 points refunded.
modus_operandi
Community Support Moderator