开发者

Touch draw events and HTML5 Canvas

开发者 https://www.devze.com 2023-03-02 03:37 出处:网络
I\'m trying to write a canvas element that can be \'draw\' on with the mouse and mobile (iOS/Android).

I'm trying to write a canvas element that can be 'draw' on with the mouse and mobile (iOS/Android).

here is my bind code:

// Mouse based interface
    $(drawing.canvas).bind('mousedown', drawing.drawStart);
    $(drawing.canvas).bind('mousemove', drawing.draw);
    $(drawing.canvas).bind('mouseup', drawing.drawEnd);
    $('body').bind('mouseup', drawing.drawEnd);

    $(drawing.canvas).bind('touchstart', drawing.drawStart);
    $(drawing.canvas).bind('touchmove', drawing.draw);
    $(drawing.canvas).bind('touchend', drawing.drawEnd);

Works with computer (PC, Mac) but not mobile (iOS/Android). I als开发者_开发技巧o tried addEventListener for the touch* events but no joy.

Any ideas?


It is either a sytax error or a jQuery problem. Distilled down, canvas.addEventListener( 'touchstart', onTouchStart, false); works just fine for android:

http://jsfiddle.net/tQW2L/

(on touch it paints a large black rectangle to confirm that it works)

0

精彩评论

暂无评论...
验证码 换一张
取 消