Question

I have some code that when the page loads gets the height of an image and then resizes its container div accordingly. This works fine unless its the first time the page has been loaded or i do a hard refresh with ctrl + f5, then it doesn’t work. I have tried using

$('#div img').load(function() {
// put the code here
});

But I get the same problem. Anyone know why this is happening?

This is my code:

maxheight = 0;
$('#venue #main-img img').each(function() {
   height = $(this).height();
   if(height > maxheight) {
      maxheight = height;
   }
   $(this).hide();
});
$('#venue #main-img').animate({ height: maxheight });
$('#venue #main-img img').first().show();

Sorry should have said. The code is within $(document).ready()

Answer 1

Try calling your code in $(window).load. This will run after all images have loaded.

$(window).load(function () {
   // run code
});

Or you could try the imgload plugin.