problem when inserting images in canvas

[attaboy123]

This is my code:

Code: Select all

$(document).ready(function() {
var canvas = document.getElementById('canvas'),
    context = canvas.getContext('2d'),
    image = new Image();
image.src = 'pattern_054.gif';
context.drawImage(image, 75, 220);
});

It works fine in Opra and FF but not Safari and Chrome, any ideas?

[zcorpan]

You try to paint the image on the canvas before it has loaded. You need to wait for image.onload, then drawImage().

[JAB Creations]

Also if you don't want your performance to suck use real JavaScript, not frameworks like jQuery when scripting.