get uploaded image dimensions with javascript / jquery?

Question

also try this but for me it isnt working.

Determining image file size + dimensions via Javascript?

i upload image, insert it on page through jquery and want to create div around inserted image, but dont know image dimensions.

$("#temp_image").html('<img src="uploads/obr1.jpg" alt="" id="tmp" />');
var img = document.getElementById('temp_image');
alert(img.clientWidth);

it show me 0, what is wrong ?

also tried:

var oImg = new Image();
oImg.src = 'uploads/obr1.jpg;
if (oImg.complete) {
  alert(oImg.width)
}

it shows me 0 too.

where is problem ? thanks

Follow this link you will get help stackoverflow.com/a/13572209 — Umesh Markande
– Umesh Markande, Commented Jul 31, 2015 at 10:18

Mark Bell · Accepted Answer · 2009-09-29 08:30:15Z

0

Should be:

$("#temp_image").html('<img src="uploads/obr1.jpg" alt="" id="tmp" />');
var img = document.getElementById('tmp');
alert(img.clientWidth);

You are currently trying to get the width of the containing div (#temp_image), not the image.

Also, if you are using jQuery, you can just do:

$("#temp_image").html('<img src="uploads/obr1.jpg" alt="" id="tmp" />');
alert($('#tmp').width());

Hope this helps!

edited Sep 29, 2009 at 8:30

answered Sep 29, 2009 at 8:24

Mark Bell

29.8k26 gold badges122 silver badges150 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

kkyy · Accepted Answer · 2009-09-29 08:26:28Z

0

var img = document.getElementById('temp_image');

doesn't actually get you the image element, it gets the element containing the image. You should try

var img = document.getElementById('tmp');

or

var img = $('#tmp')[0];

instead. Also make sure that the image is actually visible when you're getting it's dimensions, as clientWidth and clientHeight will be zero if the element is hidden.

answered Sep 29, 2009 at 8:26

kkyy

12.5k3 gold badges34 silver badges27 bronze badges

Comments

Goldie · Accepted Answer · 2011-12-09 10:43:37Z

0

I tried your method and it's working. You just didn't wrote it well. You forgot to close quotes.

var oImg = new Image();
oImg.src = 'uploads/obr1.jpg';
if (oImg.complete) {
  alert(oImg.width)
}

answered Dec 9, 2011 at 10:43

Goldie

1,6305 gold badges23 silver badges33 bronze badges

Collectives™ on Stack Overflow

get uploaded image dimensions with javascript / jquery?

3 Answers 3

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related