Question

I try to load an image as such:

var img = new Image();
img.src = 'mars.png';
img.onLoad = callback;


function callback(){
    // doesnt fire
       alert("loaded");
}

the callback never fires, whats the workaround?

Answer 1

You MUST define the onload BEFORE you change the src and event handlers are lowercase so it is spelled onload

var img = new Image();
img.onload = callback;
img.src = 'mars.png';

function callback(){
  alert("loaded");
}

or as I prefer it

var img = new Image();
img.onload = function(){
  alert("loaded");
}
img.src = 'mars.png';