Boa Tarde, eu tenho um código que permite controlar uma imagem ao carregar nas setas do teclado, ao mesmo tempo que uma outra imagem é gerada aleatoriamente pela página, e estou a tentar contar as vezes que a imagem controlada pelo teclado toca na imagem que surge aleatoriamente na página web mas não estou a conseguir criar uma função que resulte espero que me possam ajudar.
Obrigado.
Script para controlar a imagem:
Código :
HTML:
Código :
Gerar imagem aleatoriamente:
Código :
HTML
Código :
Obrigado.
Script para controlar a imagem:
Código :
var xpos = 1;
var ypos = 1;
var xspeed = 1;
var yspeed = 0;
var maxSpeed = 3;
var minx = 0;
var miny = 0;
var maxx = 1330;
var maxy = 669;
var upPressed = 0;
var downPressed = 0;
var leftPressed = 0;
var rightPressed = 0;
function slowDownX()
{
if (xspeed > 0)
xspeed = xspeed - 1;
if (xspeed < 0)
xspeed = xspeed + 1;
}
function slowDownY()
{
if (yspeed > 0)
yspeed = yspeed - 1;
if (yspeed < 0)
yspeed = yspeed + 1;
}
function gameLoop()
{
xpos = Math.min(Math.max(xpos + xspeed,minx),maxx);
ypos = Math.min(Math.max(ypos + yspeed,miny),maxy);
document.getElementById('character').style.left = xpos;
document.getElementById('character').style.top = ypos;
if (upPressed == 1)
yspeed = Math.max(yspeed - 1,-1*maxSpeed);
if (downPressed == 1)
yspeed = Math.min(yspeed + 1,1*maxSpeed)
if (rightPressed == 1)
xspeed = Math.min(xspeed + 1,1*maxSpeed);
if (leftPressed == 1)
xspeed = Math.max(xspeed - 1,-1*maxSpeed);
if (upPressed == 0 && downPressed == 0)
slowDownY();
if (leftPressed == 0 && rightPressed == 0)
slowDownX();
setTimeout("gameLoop()",10);
}
function keyDown(e)
{
var code = e.keyCode ? e.keyCode : e.which;
if (code == 38){
upPressed = 1;
document.getElementById('character').src = "ch/up.png";
}
if (code == 40){
downPressed = 1;
document.getElementById('character').src = "ch/down.png";
}
if (code == 37){
leftPressed = 1;
document.getElementById('character').src = "ch/left.png";
}
if (code == 39){
rightPressed = 1;
document.getElementById('character').src = "ch/right.png";
}
}
function keyUp(e)
{
var code = e.keyCode ? e.keyCode : e.which;
if (code == 38){
upPressed = 0;
document.getElementById('character').src = "ch/up.png";
}
if (code == 40){
downPressed = 0;
document.getElementById('character').src = "ch/down.png";
}
if (code == 37){
leftPressed = 0;
document.getElementById('character').src = "ch/left.png";
}
if (code == 39){
rightPressed = 0;
document.getElementById('character').src = "ch/right.png";
}
}
var ypos = 1;
var xspeed = 1;
var yspeed = 0;
var maxSpeed = 3;
var minx = 0;
var miny = 0;
var maxx = 1330;
var maxy = 669;
var upPressed = 0;
var downPressed = 0;
var leftPressed = 0;
var rightPressed = 0;
function slowDownX()
{
if (xspeed > 0)
xspeed = xspeed - 1;
if (xspeed < 0)
xspeed = xspeed + 1;
}
function slowDownY()
{
if (yspeed > 0)
yspeed = yspeed - 1;
if (yspeed < 0)
yspeed = yspeed + 1;
}
function gameLoop()
{
xpos = Math.min(Math.max(xpos + xspeed,minx),maxx);
ypos = Math.min(Math.max(ypos + yspeed,miny),maxy);
document.getElementById('character').style.left = xpos;
document.getElementById('character').style.top = ypos;
if (upPressed == 1)
yspeed = Math.max(yspeed - 1,-1*maxSpeed);
if (downPressed == 1)
yspeed = Math.min(yspeed + 1,1*maxSpeed)
if (rightPressed == 1)
xspeed = Math.min(xspeed + 1,1*maxSpeed);
if (leftPressed == 1)
xspeed = Math.max(xspeed - 1,-1*maxSpeed);
if (upPressed == 0 && downPressed == 0)
slowDownY();
if (leftPressed == 0 && rightPressed == 0)
slowDownX();
setTimeout("gameLoop()",10);
}
function keyDown(e)
{
var code = e.keyCode ? e.keyCode : e.which;
if (code == 38){
upPressed = 1;
document.getElementById('character').src = "ch/up.png";
}
if (code == 40){
downPressed = 1;
document.getElementById('character').src = "ch/down.png";
}
if (code == 37){
leftPressed = 1;
document.getElementById('character').src = "ch/left.png";
}
if (code == 39){
rightPressed = 1;
document.getElementById('character').src = "ch/right.png";
}
}
function keyUp(e)
{
var code = e.keyCode ? e.keyCode : e.which;
if (code == 38){
upPressed = 0;
document.getElementById('character').src = "ch/up.png";
}
if (code == 40){
downPressed = 0;
document.getElementById('character').src = "ch/down.png";
}
if (code == 37){
leftPressed = 0;
document.getElementById('character').src = "ch/left.png";
}
if (code == 39){
rightPressed = 0;
document.getElementById('character').src = "ch/right.png";
}
}
HTML:
Código :
<img id="character" src='ch/down.png' style='position:absolute;left:100;top:100;height:34;width:33;'/>
Gerar imagem aleatoriamente:
Código :
function moveDiv() {
var $span = $("#random");
$span.fadeOut(900, function() {
var maxLeft = $(window).width() - $span.width();
var maxTop = $(window).height() - $span.height();
var leftPos = Math.floor(Math.random() * (maxLeft + 1))
var topPos = Math.floor(Math.random() * (maxTop + 1))
$span.css({ left: leftPos, top: topPos }).fadeIn(900);
});
};
moveDiv();
setInterval(moveDiv, 900);
var $span = $("#random");
$span.fadeOut(900, function() {
var maxLeft = $(window).width() - $span.width();
var maxTop = $(window).height() - $span.height();
var leftPos = Math.floor(Math.random() * (maxLeft + 1))
var topPos = Math.floor(Math.random() * (maxTop + 1))
$span.css({ left: leftPos, top: topPos }).fadeIn(900);
});
};
moveDiv();
setInterval(moveDiv, 900);
HTML
Código :
<div id="container"> <span id="random"><img src="poke.png"></span> </div>