Solucionado (ver solução)
Solucionado
(ver solução)
2
respostas

Dúvida no Ex. 2 da Aula 3 - Nosso primeiro jogo

Consegui fazer o programa identificar o clique do botão direito sem abrir o menu de contexto. Porem, nao consigo imprimir a posiçao e nem fazer o tiro vermelho aparecer. Não estou conseguindo encontrar o meu erro.

<meta charset = "UTF-8">
<canvas id="tela" width="600" height="400"></canvas>


var tela = document.getElementById("tela");
var c = tela.getContext("2d");

c.fillStyle="gray";
c.fillRect(0, 0, 600, 400);

tela.onclick = function(evento){
    var x = evento.pageX-tela.offsetLeft;
    var y = evento.pageY-tela.offsetTop;
    console.log("Botão esquerdo : "+x+ "; " + y);

    c.fillStyle = "blue"
    c.beginPath();
    c.arc(x, y , 10, 0, 2*3.14);
    c.fill();

};

tela.oncontextmenu = function(evento){
    var x = evento.pageX-tela.offSetLeft;
    var y = evento.pageY-tela.offSetTop;
    console.log("Botão Direito : "+x+ "; " + y);

    c.fillStyle = "red";
    c.beginPath();
    c.arc(x, y, 10, 0, 2*3.14);
    c.fill();

    evento.preventDefault();
};
2 respostas
solução!

Octavio, Bom dia !

Encontrei o o erro .

na função do botão direito repare que há um erro de digitação onde você escreveu offSetLeft e offSetTop , onde na verdade teria que ser da seguinte forma :

offsetLeft e offsetTop , com o S em minusculo e você escreveu em maiúsculo .

altere seu código e veja se solucionou seu problema .

espero ter ajudado .

Era isso mesmo. Pouco tempo depois eu encontrei o erro e esqueci de retirar a pergunta do fórum. Demorei muito pra achar...hehe. Obrigado pela ajuda.