Suzanne Edelman Creoconcept Suzanne Edelman Creoconcept - 2 months ago 6
HTML Question

Invoke function once, only after JQuery created images are loaded

I've been searching for a solution but all i'm getting is $(window).on("load", fuction(){}) which just loads the html resources.
I'm creating a variable amount of images and inserting them in a div with jquery using an each() function after the window is loaded.

$.each(footeradds, function(fad){
$("<div class=\"footerads\"><img src=\"image" + fad + ".jpg\"/></div>").appendTo(".footer");
});


I need to calculate the width of the container of these images which depends on the amount of images and their width, which they only have after they've loaded.

if i do

$(".footer img").on("load", function() {})


that function is called every time an image loads, and need it to only be called once, after ALL images have loaded.

My question is: how can i invoke a function after images created with jquery are loaded?

Answer

there is no methods for it but you can do one thing

take a variable A = count all images , then create other variable B = 1 and increment it on every image load and check condition A == B

that condition will true when last image will called .....:)

Comments