觸摸繪製事件和HTML5畫布

我正試圖編寫一個可以用鼠標和移動（iOS/Android）「繪製」的畫布元素。觸摸繪製事件和HTML5畫布

這裏是我的綁定代碼：

 
// 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);

工程與計算機（PC，蘋果機），但不移動（的iOS/Android的）。我也嘗試addEventListener爲touch*事件，但沒有喜悅。

任何想法？

來源

2011-05-03 cbrulak

所以，你已經嘗試'canvas.addEventListener（「touchstart」， onTouchStart，false）;'？現在完全忽略jQuery，試着讓它工作。 – 2011-05-03 14:05:19

添加了黑色的矩形代碼，但它不適用於繪製線條等。所以我想知道是不是繪圖功能沒有工作或者什麼的。 – cbrulak 2011-05-03 22:38:26

這很可能是其他問題導致他們的問題。在你的代碼中開始削減東西，直到你獲得一個工作版本，然後從那裏恢復工作。 – 2011-05-03 23:51:18

它是一個sytax錯誤或jQuery問題。蒸餾下來，canvas.addEventListener('touchstart', onTouchStart, false);作品就好了針對Android：

http://jsfiddle.net/tQW2L/

（觸摸它描繪了一個大的黑色矩形，以確認它的工作原理）

來源

2011-05-03 14:10:43

觸摸繪製事件和HTML5畫布

回答

相關問題