Suppose I have this image:

<img src="images/01.jpg" border="0" rel="shadow" />

Then with jQuery, I get its width using:

$('[rel="shadow"]').width();

Firefox and IE report correct dimensions of the image eg 140px while Chrome reports 0. How to solve this problem?

Note

I don't want to set explicit width for images eg:

<img src="images/01.jpg" border="0" rel="shadow" width="140" />

So, how to get width in cross-browser way which is not defined in width attribute of elements?

Suppose I have this image:

<img src="images/01.jpg" border="0" rel="shadow" />

Then with jQuery, I get its width using:

$('[rel="shadow"]').width();

Firefox and IE report correct dimensions of the image eg 140px while Chrome reports 0. How to solve this problem?

Note

I don't want to set explicit width for images eg:

<img src="images/01.jpg" border="0" rel="shadow" width="140" />

So, how to get width in cross-browser way which is not defined in width attribute of elements?

• javascript
• jquery
• html
• css

Share Improve this question Follow edited Jul 31, 2018 at 23:29 halfer 20.4k1919 gold badges109109 silver badges202202 bronze badges asked Mar 13, 2010 at 19:29 SarfrazSarfraz 383k8282 gold badges559559 silver badges612612 bronze badges 7

• What version of Chrome? Is the script inside a load event handler or $(document).ready? – Crescent Fresh Commented Mar 13, 2010 at 19:31
• @Crescent Fresh: Chrome version is: 4.0.295.0 and the script is inside ready. – Sarfraz Commented Mar 13, 2010 at 19:32
• It seems it poses a problem with both Chrome and Safari. – Anthony Forloney Commented Mar 13, 2010 at 19:32
• @Anthony Forloney: any possible solution to this? Is this a bug in those browsers? – Sarfraz Commented Mar 13, 2010 at 19:34
• 1 @loviji: exactly, that's why I asked. The answer is trivial if we know which of load or ready is being used. – Crescent Fresh Commented Mar 13, 2010 at 19:39

 |  Show 2 more ments

1 Answer 1

Sorted by: Reset to default 8

$(window).load(
    function() {
        alert($('img').width());
    }
);

This will work: Test case. Basically it will wait until images load before executing the code (when the ready function fires the document has been fully loaded but images haven't).