jquery call a function after script load time

Question

i have a page with something like:

link
link
link
link
somethingelse(div)

with my script i change the link in a img and the after i have to edit the somethingelse....

but now i have a problem.. i need the cords of the div but when i try to get it i get the cords BEFORE the img is loaded.... and i get the wrong cords....

how i can run the function after the complete load of the images?

pseudocode:

$("a").each(function(){ replaceAtoIMG(this)}); //change <a> with <img> and add a new image loading
$("div").each(function(){ $(this).position() }); //return value BEFORE the fully completed load

• user400654: Easy. wait until the images are loaded to get the position. If you are unsure of how to do that, maybe that should have instead been your question, however that's a duplicate many times over.
• Trigun: i tried with .load or ready... but i don't get it works...
• user400654: Nether of those methods will help you. you will have to loop over each image and detect when each one finishes. When they are all finished, you then get the position.
• Trigun: oh something like $('img').on('load', function() { if ($('img').length == X) else X++ })
• user400654: exactly like that (ignoring syntax)

Answer 1

$('img').on('load', function() {
 // do whatever you want
});

This should solve your on load problem at least.

Sorry, was at work and using phone for stackoverflow so had to be quick.

However, if needing your function to apply to each image on load then you can wrap your on load function inside an each() function. Untested so might need a little fandangling:

$('img').each(function(){
 $(this).on('load', function() {
 // do whatever you want }); 
 });

That should attach that function to all img tags and trigger when theyre done loading. Then you can use their coords or what not youre trying to achieve. Your pseudocode confused me.