Assigning touch events to elements within canvas - iPad

Question

I'm creating a web app for the iPad and I'm trying to assign a touch event to an element within canvas. I have it set up like this:

function initialize() {
    touch_element = new Image();
    touch_element.src = 'img/image.png'
    touch_element.onload = function(){
        canvas.drawImage(football, 50, 50, 184, 120);
        touch_element.addEventListener('touchstart', touch_start, false);
        touch_element.addEventListener('touchmove', touch_move, false);
        touch_element.addEventListener('touchend', touch_end, false);
    }
}

I'm not getting any errors returned and the image is loading just fine. The only thing is that the touch events aren't firing. Is it possible to do this within canvas?

Thanks,

Joe

Answer 1

You can't assign touch events to an image object. The only valid attributes are onerror, onload, src, validate.

A related thread: Bind event to shape on canvas