Question

I have an image that is wrapped inside a couple of DIV elements

<div id="wrapper">
...
<img src="myphoto.png" height="400px" width="500px>
</div>

I use jQuery, to access the height or width I either use

jQuery(img).attr('height');

or

jQuery(img)[0].height;

Unluckily, when the wrapping DIV ‘display’ property change, these values are set to 0
for example, if I do

$('#wrapper').hide()
then
jQuery(img)[0].height = 0;

The same for the attributes.

Any idea how to fix this, showing the DIV, getting the values and hidding it again does solve the problem, however I can’t guess the number of wrapping DIVs as it can (and their behaviors change).

Thanks

Edit: Thanks for all answers. However, I forget to mention that I don’t control DIV hiding and style. My script plays with Images and is made to integrate in any page, so the user is the one who do hide/Show/change the values.

Answer 1

Use .css() to get the stored value instead, like this:

jQuery('img').css('height');

I know it sounds a bit strange, but before you dismiss it, try it 🙂