Question

In Firefox 8.0 on ubuntu 11.10, the onload function, draw, is called although img.complete is false. I managed to solve it somewhat with the setTimeout hack, but it’s not pretty.
I tried setting the img.onload before setting img.src. Although I always get img.complete as true this way, img.width is zero, and img.src si also empty, so it doesn’t work.
Any ideas how to implement this properly?

        var draw=function(img,ctx,x,y)
        { if(!img.complete)
            {   setTimeout(function(){draw(img,ctx,x,y);},50);
            }
            else
            {
                ctx.drawImage(img,x,y); 
            }
        }
        for(i=0;i<9;i++)
        {   img=new Image();
            img.src="/media/"+url[i];
            img.onload=(draw)(img,ctx,tile.x*offset[i].x,tile.y*offset[i].y);
        }   

Answer 1

The complete property is buggy in Firefox. Once it’s true, it’s always true (even if you change the image).

I got around it by testing a new Image object.