Get height after html loaded

JavaScript
1

Hi,

I am trying to insert a blob of html with images into a div and then get the height of that div after the html blob has been loaded into it from the server. If i do this in a click event i.e. insert the html into my jQuery target and then after that get the height of the target it doesnt wait until the html and images have been loaded into the page. Anyone know how i can pause the .height event until the .html event content has been downloaded from the server?


                         $('.tabs dd').click(function() {

				$('.target').find('.tabContent').html('<p>test content with images</p>');

				var tabHeight = $('.target').height();
			});

Thanks!

2

$(‘.tabs dd’).click(function() {

			$('.target').find('.tabContent').html('&lt;p&gt;test content with images&lt;/p&gt;');

			var tabHeight = setTimeout("$('.target').height()",500);
		});
3

Hi Wolf,

I have tried this method but at 500 some tabs havent downloaded fully. I need to set it to 2000 to be sure it will be fully downloaded and that’s a bit of a wait. Also, on a poor mobile connection it could take a long time to fully download.

4

Maybe
MutationObserver
DOMSubtreeModified
DOMNodeInserted
DOMNodeInsertedIntoDocument
??

5

Thanks. I’ll have a look into them.