如何在ipad中使用safari绘制canvas元素?

时间:2012-10-03 10:09:03

标签: ipad html5

我正在尝试实现一个canvas元素来触摸safari / ipad中的登录。我已经使用mousedown mouseup和mousemove事件为桌面浏览器完成了它。我必须使用哪些事件在ipad中做同样的事情? touchstart,touchend和touchmove?

这是我的功能

var pizarra_canvas
var pizarra_context

function init(){


    alert('2')
    pizarra_canvas = document.getElementById("pizarra");
    pizarra_context = pizarra_canvas.getContext("2d");
    pizarra_context.strokeStyle = "#000";
    pizarra_canvas.addEventListener('touchstart',empezarPintar,false);
    pizarra_canvas.addEventListener('touchend',terminarPintar,false);
alert('1')
}

function empezarPintar(e){
pizarra_context.beginPath();
pizarra_context.moveTo(e.clientX-pizarra_canvas.offsetLeft,e.clientY-          pizarra_canvas.offsetTop);
pizarra_canvas.addEventListener('touchmove',pintar,false)
}

function terminarPintar(e){
pizarra_canvas.removeEventListener('touchmove',pintar,false);
}

function pintar(e) {
pizarra_context.lineTo(e.clientX-pizarra_canvas.offsetLeft,e.clientY-    pizarra_canvas.offsetTop);
pizarra_context.stroke();
}

1 个答案:

答案 0 :(得分:1)

我建议您查看http://www.kineticjs.com/http://paperjs.org/等框架,这些框架在触摸屏上处理画布时会有很大帮助。