11484 sujets

JavaScript, DOM et API Web HTML5

Bonjour, tout le monde,
j'aimerai pouvoir signer avec le doigt mon canvas sur les versions mobile. Le code fonctionne bien en desktop, je veux que cela fasse pareil en mobile. (TOUCH EVENT)
Merci
var painting = false;

var canvas = document.getElementById("canvas");

var context = canvas.getContext("2d");

canvas.addEventListener("mousedown", down);

canvas.addEventListener("mouseup", toggledraw);

canvas.addEventListener("mousemove", 

    function (evt) {
    var mousePos = getMousePos(canvas, evt);
    var posx = mousePos.x;
    var posy = mousePos.y;
    draw(canvas, posx, posy);
});

function down () {
    painting = true;
    context.beginPath();
}

function toggledraw () {
    painting = false;
    canvas.style.cursor = "default";
}

function getMousePos(canvas, evt){
    var rect = canvas.getBoundingClientRect();
    return{
        x:evt.clientX - rect.left,
        y:evt.clientY - rect.top
    };
}

function draw(canvas, posx, posy){
    if(painting){
        context.fillRect(posx, posy, 1, 1);
        context.lineTo(posx, posy);
        canvas.style.cursor = "pointer";
        context.stroke();
    }
}