Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations Chriss Miller on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Picture Size 3

Status
Not open for further replies.

fischadler

Programmer
Joined
May 31, 2002
Messages
258
Location
MT
Is there a way an ASP page can determine the size (width x height) of a picture file without having to use any third party applications/dlls?
 
what are you trying to do? I usually use client-side javascript to work with image sizes...

Programming today is a race between software engineers striving to build better and bigger idiot-proof programs, and the Universe trying to produce bigger and better idiots. So far, the Universe is winning. - Rick Cook (No, I'm not Rick)

zen.gif
 
I need to set the width and height properties of the <img> tag so that a picture of the size of say 800x600 is shown as 100x75. But the pictures vary in size so I need to know the size and aspect ratio so that I can specify the correct width and height values of the shrunk version.
 
A better idea is to resize images to thumbnails and display them linked to the main pic. A 800x600 100Kb image is still 100Kb when shown at 100x75, put 20 of these on a page and you could end up with a 10min page load time on dial-up, The average user won't wait 20secs most times.

ASP doesn't create on the fly thumbnails without 3rd party components, ASP.NET can though, so if your server is .net enabled.




Chris.

Indifference will be the downfall of mankind, but who cares?
 
If you are not concerned about chrisHirst's valid point about file size, you can create a client-side javascript function that fires when the image loads...
Code:
<script>

function sizer(imgObj){
  imgWidth = imgObj.width
  imgHeight = imgObj.height
  maxWidth = 100
  maxHeight = 75
  if (imgWidth > maxWidth){
    imgObj.width = maxWidth
    newRatio = imgWidth / maxWidth
    imgObj.height = imgHeight / newRatio
  }
  imgWidth = imgObj.width
  imgHeight = imgObj.height
  if (imgHeight > maxHeight){
    imgObj.height = maxHeight
    newRatio = imgHeight / maxHeight
    imgObj.width = imgWidth / newRatio
  }
}
</script>


<img onLoad="sizer(this)" src="myImg.jpg">


Programming today is a race between software engineers striving to build better and bigger idiot-proof programs, and the Universe trying to produce bigger and better idiots. So far, the Universe is winning. - Rick Cook (No, I'm not Rick)

zen.gif
 
Thanks, ChrisHirst and mwolf00. Both Suggestions are intereseting. However there are some problems with both. I have never written in ASP.NET and I have no idea about how to convert my page (that has already been written in standard ASP) to ASP.NET. As ChrisHirst rightly pointed out, it would be better to transmit a reduced version of the file (if only I knew ASP.NET!).
The problem with mwolf00's suggestion is that it works intermittently. When I load a the page the first time, all pictures are resized properly, but if I refresh the page, some of the pictures come up in full size. If I refresh again, a different combination of the same pictures comes in full size. Could it be because the names of the pictures are being retrieved from a Database?
 
are you putting the following line of code at the top of your page?

response.expires = 0

The onLoad event should fire anytime the page loads.

Programming today is a race between software engineers striving to build better and bigger idiot-proof programs, and the Universe trying to produce bigger and better idiots. So far, the Universe is winning. - Rick Cook (No, I'm not Rick)

zen.gif
 
No I wasn't putting that. You mean I have to put it? What does it do?
 
I found that I was still getting intermittant image sizing even with response.expires = 0 included in the file.

I added the function to this function to run through all the images in the page

Code:
function sizeall(){
var imgObj = document.getElementsByTagName("img");
for (var i=0; i<imgObj.length; i++){
sizer(imgObj[i]);
}
}

Then added this as <body onload="sizeall();">

This seems to load the images correctly each time.
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top