Javascript - wait images to be loaded

Question

var l = false;
var l2 = false;

var imm = new Image();
imm.src = \"b.png\";

imm.onload = function(){
l = true;
}

var imm2 = new Image();
imm2.src = \"c.png\";

imm         


        

Answer 1

More elegant way in my opinion:

var loadedImagesCount = 0;
var imageNames = ["b.png", "c.png"];
var imagesArray = [];
for (var i = 0; i < imageNames.length; i++) {
    var image = new Image();
    image.src = imageNames[i];
    image.onload = function(){
        loadedImagesCount++;
        if (loadedImagesCount >= imageNames.length) {
            //loaded all pictures
        }
    }
    imagesArray.push(image);
}

Instead of messing with lots of different image variables, just store the image names in plain array then loop over this and count how many pictures are loaded.