Uma função para jogo da velha
Olá, bom dia. Necessito de ajuda para construir uma função em javascript, coisa simples, mas para quem está iniciando é meio complicado.
Fiz um jogo da velha, que nele deve ter o TABULEIRO, e o click só vale dentro da area do canvas , ok ... até aí eu consegui fazer, mas tem uma parte que " A CADA CLIQUE NA AREA DO CANVAS , DESENHAR UMA BOLINHA, ALTERNADA DE CORES DIFERENTES " .
Isso aqui que quero fazer -> Com Javascript, capturar a posição do mouse dentro dos limites do desenho e, a cada clique, desenhar de forma alternada o círculo ou o traço.
Fiz o código , falta a função :( que tá brabo pra mim
<body onload="javascript: mesadojogodavelha();">
<canvas onclick="clicandu()" width="500" height="500" id="bordas"></canvas>
function mesadojogodavelha() var bordas = document.getElementById('bordas');
width = bordas.width;
height = bordas.height;
context = bordas.getContext('2d');
context.beginPath();
context.strokeStyle = '#000';
context.lineWidth = 2;
context.moveTo((width / 3), 0);
context.lineTo((width / 3), height);
context.moveTo((width / 3) * 2, 0);
context.lineTo((width / 3) * 2, height);
context.moveTo(0, (height / 3));
context.lineTo(width, (height / 3));
context.moveTo(0, (height / 3) * 2);
context.lineTo(width, (height / 3) * 2);
context.stroke();
context.closePath();
}
function clicandu (){
img = new Image();
img.src = "http://www.dikopataka.com.br/images/bolinha_vermelha.png";
context.drawImage( img , 50, 50);
img = new Image();
img.src = "http://www.dikopataka.com.br/images/bolinha_amarela.png";
context.drawImage( img , 50, 50);
}Discussão (4)
Carregando comentários...