anun1

miércoles, 8 de diciembre de 2021

juego simple en javascript y html

 hola aqui les dejare un simple juego hecho en html y javascript, no soy bueno programando juegos o para la programacion en javascript pero por algo se empiesa, el juego es simple el cual consiste en no dejar que la pelotita caiga y asi ir sumando puntos asi que si quieren hecharle un vistaso al codigo aqui abajo se los dejare por si lo quieren checar solo copean y pegan en el bloc de notas y aguardar con la extencion html


Codigo 

<html>

<head><title>Mi pelotita</title>

</head>

<body onkeypress="barra()" onkeydown="barra()">

<div id="bola" style="border-radius:20px;background-color:red;width:30px;height:30px;position:absolute;top:0;left:0;"></div>

<div id="base" style="background-color:black;width:100px;height:10;position:absolute;top:600;left:0">

<div id="puntos" style="background-color:blue;width:100;height:30;position:fixed;top:700;left:500;color:white;text-align:center;">0</div>

<script>

var xx=0,yy=0

setTimeout("move()",60)

function move()

{

  var x  = parseInt(document.getElementById("bola").style.left)

  var y  = parseInt(document.getElementById("bola").style.top)

  var by = parseInt(document.getElementById("base").style.top)

  var bx = parseInt(document.getElementById("base").style.left)

  

  if(x>screen.width)

  {

     xx=1

  }

  if(x<=0)

  {

     xx=0

  }

  if(y>screen.height)

  {

     yy=1

document.getElementById("puntos").innerHTML=0

  }

  else if(y==by && x>=bx && x<=(bx+100))

  {

     yy=1

var puntos=parseInt(document.getElementById("puntos").innerHTML)

    puntos++

    document.getElementById("puntos").innerHTML=puntos

  }

  if(y<=0)

  {

     yy=0

  }

  

  if(xx==1)

  {

     x-=10

  }

  else

  {

     x+=10

  }

  

  if(yy==1)

  {

     y-=10

  }

  else

  {

     y+=10

  }  

  document.getElementById("bola").style.left=x

  document.getElementById("bola").style.top=y

  setTimeout("move()",60)

}

function barra()

{

  var x=parseInt(document.getElementById("base").style.left)

  

  if(event.keyCode==39 && x<screen.width) 

  {

     document.getElementById("base").style.left=x+80

  }  

  if(event.keyCode==37 && x>0) 

  {

     document.getElementById("base").style.left=x-80

  }  

}

</script>

</body>

</html>


bueno saludos y espero le sea de su agrado, nota: se puede aumentar el nivel poniendo bloques a destruir pero eso se los dejo a ustedes por si quieren seguirle



No hay comentarios.:

Publicar un comentario