How to tell if an image has been given a specific width/height with Javascript (jQuery)?

Possible Duplicate:
How to get image size (height & width) using javascript? 

Normally we can get image width with $('img').width() or $('img').css('width') when width is specified like the following
<img src="image.gif" width="32" height="32" />
<img src="image.gif" style="width: 32px; height: 32px" />

But if we don't specify a width:
<img src="image.gif" />

IE will return 28px, and FF will return 0px.
The problem is that we might set an image width to 28px or 0px intentionally, which would result a same number with the condition where no width is actually set.
My question is: how can we tell whether an image has been given a specific width/height or not?
edit
sorry folks, forgot one important thing: 28px on IE and 0px on FF only happens when image cannot be found (404)

Even more problematic is a width via a class I guess: <img src="image.gif" class="wide"> with .wide { width: 32px; }

Does IE return 28px with .width() or with .css('width')?

This is a duplicate question. See http://stackoverflow.com/questions/623172/how-to-get-image-size-height-width-using-javascript OR http://stackoverflow.com/questions/5633264/javascript-get-image-dimensions

@qodeninja nah...completely different. I'm looking for a method to check if dimensions are given, not dimension values.

@user1643156 - it's the same thing. If theres no value, then the dimension isnt set.

@qodeninja that does not apply to 404 not found. both IE and FF will return a number just like a value has been set.

@user1643156 yes well your question didnt state that issue before --  thanks for updating it.

Check .attr('width') / .attr('height').

what if the width is explicitly set using CSS?

I believe that only checks if a width/height attribute has been specified.

@ahren then you can check .css('width') or even look at .attr('style').

If you don't care if it was set with an height/width attr or a css declaration, you could use .height() or .width()

If you need to figure out the actual width and height of the image, then .width() and .height() is a much better choice as it looks for the actual image size first and then checks for the attributes if the actual image width is not available. There should never be a reason to use .attr('width')/.attr('height') over .width() and .height().

It's a hack, but you can get the original HTML this way:
var htmltag=$("img")[0].outerHTML;

And then parse this for width="..." or style="...":
if (
    htmltag.match(/style=['"][^'"]*width:/) ||
    htmltag.match(/width=['"]/)
   ) alert("Has width");

There are edge cases with border-width and so on, but you get the idea.

thanks Wolfgang, but styles that are set in external css files cannot be detected with your method. (yes, I didn't mention external css)

Images load asynchronously in the browser, so it depends on where you check for the dimensions. I think what you're seeing is that the image has not yet loaded when you query the width or height.
If you run this you may see that the initial alert() reports 0 but if you then click on the button it shows the actual size:
<img id="Image" src="images/MessageBoardLogo.png" />
<input type="button" id="Button" value="Caption" />

<script type="text/javascript">
$().ready( function() {
    imageSize();

    $("#Button").click(imageSize);
});
function imageSize()
{
    alert($("#Image").width());
}        
</script>

Ironically for me FireFox immediately reports the width in the first example, IE and Chrome show 0px, but that just goes to show it depends on the timing of the browser, the load time for the image etc.
The best way to ensure that the image has loaded and is ready to read the size reliably is a with a load handler:
$("#Image").load( function() { 
                      // do whatever you need with width and height
                      global.imgWidth = $(this).width(); 
                      global.imgHeight = $(this).height() 
                   });

