How to get real image width & height (cross browser) by JavaScript function ?
-
3"as the title" is unacceptable text, you are asking others to take sometime to answer your question, do the curtesy of taking some time to ask your question.AnthonyWJones– AnthonyWJones2009-01-13 15:36:31 +00:00Commented Jan 13, 2009 at 15:36
Add a comment
|
4 Answers
First of all, you have a greater chance of getting your question answered if you'd just ask it in a more polite way, and supplying as much relevant information as possible.
Anyway...
For as far as I know, you can use the .width property across pretty much all browsers:
function getDimensions(id) {
var element = document.getElementById(id);
if (element && element.tagName.toLowerCase() == 'img') {
return {
width: element.width,
height: element.height
};
}
}
<img id="myimage" src="foo.jpg" alt="" />
// using the function on the above image:
var dims = getDimensions('myimage');
alert(dims.width); --> shows width
alert(dims.height); --> shows height
1 Comment
Mild Fuzz
height misreports in IE11
var realWidth = $("#image").attr("naturalWidth");
var realHeight = $("#image").attr("naturalHeight");
1 Comment
George
where is the documentation for this?
Yay, Google!
There's a few ways to do this depending on exactly what you need (which you have unhelpfully omitted to include). Probably the simplest in a general sense is to get a reference to the Image object and inspect the width and height properties.
3 Comments
Dror
I like to give this to people when it's obvious they did not google: letmegooglethatforyou.com/?q=javascript+image+width+height
Plynx
For me, this very page is the result of that Google search today.
Andrzej Doyle
I can assure you it wasn't when I posted this two-and-a-half years ago. :)
jquery + <img src="" ... id="hello" /> + $("#hello").width()
