andrew nguyen
andrew nguyen

Reputation: 513

How to use height() on a div with an image inside that's using width: 100%

so I have

div {
    width: 20%;
}

img {
    width: 100%;
}
<div>
<img />
</div>

So the image scales appropriately, depending on the width of the div. I want to find the height of the image using jQuery.

var imgHeight = $(img).height();
console.log(imgHeight);

However, it's coming back as 0 (the height of the div). How do I get the rendered height of the image?

Thanks!

Upvotes: 0

Views: 89

Answers (1)

ddb
ddb

Reputation: 1406

As loganfsmyth has commented, the you need to wait for the image to finish loading.

Are you putting the code in document.ready ?

$(document).ready(function() {

  var imgHeight = $(img).height();
  console.log(imgHeight);
});

Upvotes: 1

Related Questions