473,322 Members | 1,526 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,322 software developers and data experts.

Getting width and height from a picture file

Greetings.

Is there any way, in Javascript, to put in 2 variables the width and
height of a picture, given the filename and without the picture being
displayed in the webpage?

Thank you,
Joaquim Amado Lopes

Feb 6 '08 #1
6 2120
Joaquim Amado Lopes wrote on 07 feb 2008 in comp.lang.javascript:
Is there any way, in Javascript, to put in 2 variables the width and
height of a picture, given the filename and without the picture being
displayed in the webpage?
Just put the img outside the viewable window

style='position:absolute;left:-1000px;'

and then measure it.

I think.

--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)
Feb 6 '08 #2
Greetings.

On 06 Feb 2008 23:06:41 GMT, "Evertjan."
<ex**************@interxnl.netwrote:
>Is there any way, in Javascript, to put in 2 variables the width and
height of a picture, given the filename and without the picture being
displayed in the webpage?

Just put the img outside the viewable window

style='position:absolute;left:-1000px;'

and then measure it.

I think.
It's not practical for what I need.

I have a form to publish articles, in which the user chooses the
picture to display with the article.
The list of pictures is collected from a folder and presented in a
SELECT form field. As the user chooses one of the items on the list
(onChange), that picture is previewed.

As some of the pictures may be quite large and must be previewed with
reduced dimensions, I need to know the dimensions of each picture
before displaying it, to determine the width and height of the preview
and maintain the proportions.

Cheers,
Joaquim Amado Lopes

Feb 6 '08 #3
Joaquim Amado Lopes <ja*****@jalopes.net.writes:
Greetings.

On 06 Feb 2008 23:06:41 GMT, "Evertjan."
<ex**************@interxnl.netwrote:
>>Is there any way, in Javascript, to put in 2 variables the width and
height of a picture, given the filename and without the picture being
displayed in the webpage?

Just put the img outside the viewable window

style='position:absolute;left:-1000px;'

and then measure it.

I think.
It's not practical for what I need.

I have a form to publish articles, in which the user chooses the
picture to display with the article.
The list of pictures is collected from a folder and presented in a
SELECT form field. As the user chooses one of the items on the list
(onChange), that picture is previewed.

As some of the pictures may be quite large and must be previewed with
reduced dimensions, I need to know the dimensions of each picture
before displaying it, to determine the width and height of the preview
and maintain the proportions.
Then you may be out of luck: to determine the dimensions you *will* have
to examine the content of the image stream. How much of the content
you'll need is dependent on the type of image. You may need most or all
of it.

You could possibly be able to hack something together for the major file
types using Ajax, but I would suggest you move all of that to the
server, where there are plenty of libraries and resources that will
handle this much better.

Joost.
Feb 6 '08 #4
Greetings.

On Thu, 07 Feb 2008 00:42:31 +0100, Joost Diepenmaat <jo***@zeekat.nl>
wrote:
[snip]
>I have a form to publish articles, in which the user chooses the
picture to display with the article.
The list of pictures is collected from a folder and presented in a
SELECT form field. As the user chooses one of the items on the list
(onChange), that picture is previewed.

As some of the pictures may be quite large and must be previewed with
reduced dimensions, I need to know the dimensions of each picture
before displaying it, to determine the width and height of the preview
and maintain the proportions.

Then you may be out of luck: to determine the dimensions you *will* have
to examine the content of the image stream. How much of the content
you'll need is dependent on the type of image. You may need most or all
of it.

You could possibly be able to hack something together for the major file
types using Ajax, but I would suggest you move all of that to the
server, where there are plenty of libraries and resources that will
handle this much better.
I wasn't clear in my previous post. The images are on the server.
The upload part is already working.

Cheers,
Joaquim Amado Lopes

Feb 7 '08 #5
Joaquim Amado Lopes <ja*****@jalopes.net.writes:
>>As some of the pictures may be quite large and must be previewed with
reduced dimensions, I need to know the dimensions of each picture
before displaying it, to determine the width and height of the preview
and maintain the proportions.

Then you may be out of luck: to determine the dimensions you *will* have
to examine the content of the image stream. How much of the content
you'll need is dependent on the type of image. You may need most or all
of it.

You could possibly be able to hack something together for the major file
types using Ajax, but I would suggest you move all of that to the
server, where there are plenty of libraries and resources that will
handle this much better.
I wasn't clear in my previous post. The images are on the server.
The upload part is already working.
Well, if you know the dimensions on the server, just use an Ajax to
fetch them:

http://developer.mozilla.org/en/docs...etting_Started

Note that that text uses XML in the response. It's usually easier and
faster to use a javascript response and eval() it to parse the data.
See also http://www.json.org/

Joost.
Feb 7 '08 #6
Joaquim Amado Lopes wrote on 07 feb 2008 in comp.lang.javascript:
Greetings.

On 06 Feb 2008 23:06:41 GMT, "Evertjan."
<ex**************@interxnl.netwrote:
>>Is there any way, in Javascript, to put in 2 variables the width and
height of a picture, given the filename and without the picture being
displayed in the webpage?

Just put the img outside the viewable window

style='position:absolute;left:-1000px;'

and then measure it.

I think.
It's not practical for what I need.

I have a form to publish articles, in which the user chooses the
picture to display with the article.
The list of pictures is collected from a folder and presented in a
SELECT form field. As the user chooses one of the items on the list
(onChange), that picture is previewed.

As some of the pictures may be quite large and must be previewed with
reduced dimensions, I need to know the dimensions of each picture
before displaying it, to determine the width and height of the preview
and maintain the proportions.
Doing this clientside without downloading seems impossible.

I suppose you better use a serverside javascript solution, like:

http://www.aspjpeg.com/object_aspjpe...OriginalHeight
http://www.aspjpeg.com/object_aspjpe...#OriginalWidth
--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)
Feb 7 '08 #7

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

15
by: middletree | last post by:
How do I request the actual page name that I'm on? This is going to go into an include file, and depending on which page I'm on, I'd like to do different things. I'm looking for "pagename.asp"
1
by: Mustafa Rabie | last post by:
dear all, i am writing an application where the user can upload his own picture. I wanted to get the Width and Height of the uploaded picture. So i assigned the uploaded image to an aspnet...
3
by: Hitesh | last post by:
Hi, I am getting the response from another Website by using the HttpHandler in my current site. I am getting the page but all the images on that page are not appearing only placeholder are...
4
by: Doug van Vianen | last post by:
Hi, I have the following coding on a web page. It causes two pictures (pic1.jpg and pic2.jpg) to show, one above the other and then when one clicks on the top picture is squeezes to the left...
18
by: pecan | last post by:
I have hundreds of pictures on my site. The thumbnails are all a standard size, and most of the bigger ones are the same size too. When I run my html code through my optimizer it throws out a...
3
by: find clausen | last post by:
Is it possible to get the width of a picture: <img src="../graphics/press/bw21.jpg" width=400 height=555 alt="" border="0"> the make a box be exactly the width of the picture: ...
1
epots9
by: epots9 | last post by:
I have a image inside of a div <div id="image"> <div id="loader"> <img id="loaderImage" src="assets/loader.gif" alt="loading..." /> </div> <div id="loaded"> <img id="picture" src="" alt=""...
9
by: Summercool | last post by:
I wonder to show the images in a table format... and to set a box of width 100px and height 100px, is there a way? Right now, if I set width to 100px, then height can be 180px... If I set...
9
Catalyst159
by: Catalyst159 | last post by:
I have a form which is used to calculate residential Floor Area Ratio (FAR). The form is structured into seven parts as follows: Part A: Maximum FAR and Floor Area: Part B: Gross Floor Area of...
0
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 6 Mar 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, we are pleased to welcome back...
0
by: Vimpel783 | last post by:
Hello! Guys, I found this code on the Internet, but I need to modify it a little. It works well, the problem is this: Data is sent from only one cell, in this case B5, but it is necessary that data...
0
by: jfyes | last post by:
As a hardware engineer, after seeing that CEIWEI recently released a new tool for Modbus RTU Over TCP/UDP filtering and monitoring, I actively went to its official website to take a look. It turned...
0
by: ArrayDB | last post by:
The error message I've encountered is; ERROR:root:Error generating model response: exception: access violation writing 0x0000000000005140, which seems to be indicative of an access violation...
1
by: CloudSolutions | last post by:
Introduction: For many beginners and individual users, requiring a credit card and email registration may pose a barrier when starting to use cloud servers. However, some cloud server providers now...
1
by: Defcon1945 | last post by:
I'm trying to learn Python using Pycharm but import shutil doesn't work
0
by: af34tf | last post by:
Hi Guys, I have a domain whose name is BytesLimited.com, and I want to sell it. Does anyone know about platforms that allow me to list my domain in auction for free. Thank you
0
by: Faith0G | last post by:
I am starting a new it consulting business and it's been a while since I setup a new website. Is wordpress still the best web based software for hosting a 5 page website? The webpages will be...
0
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 3 Apr 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome former...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.