ErrorDeSintaxis

Pequeños fragmentos de código fuente en distintos lenguajes de programación, agrupados por categorías.

Puedes buscar entre los fuentes existentes, o aportar los tuyos.

Javascript: Mover una nave y disparar desde Javascript

Ejemplo de cómo mover una nave y disparar en una página web, usando Javascript

Lenguaje: Javascript (compilador: Firefox 5, IE 8, Chrome 13)

Categoría: Minijuegos

// Fuente procedente de ErrorDeSintaxis.es 
// Ejemplo de cómo mover una nave y disparar 
//  en una página web, usando Javascript 
// Lenguaje: Javascript 
// Compilador: Firefox 5, IE 8, Chrome 13 
// Nivel: Básico 
// Disponible desde 07/08/2011 
// Aportado por Nacho 
// Autor original: deadlypetal 
// Web original: http://www.dreamincode.net/code/snippet183.htm 

<html>
<head>
<title>Animacion</title>
 
<style>
#nave{
  position:absolute;
  left:400px;
  top:200px;
}
 
#disparo{
  position:absolute;
  left:400px;
  top:500px;
}
</style>
 
<script>
xDisparo=400; yDisparo=100;
xNave=400; yNave=200;
var temporizador;
 
function moverIzquierda(){
   xNave=xNave-10;
   obj=document.getElementById("nave");
   obj.style.left=xNave +"px";
}
 
function moverDerecha(){
   xNave=xNave+10;
   obj=document.getElementById("nave");
   obj.style.left=xNave +"px";
}
 
function comprobarTeclas(event){
  tecla = event.keyCode;
 
  if(tecla==37) moverIzquierda();
  if(tecla==39) moverDerecha();
  if(tecla==13) disparar();
}
 
function moverDisparo(){
  yDisparo = yDisparo-10;
  obj=document.getElementById("disparo");
  obj.style.left=xDisparo;     
  obj.style.top=yDisparo +"px";
  if (yDisparo < 0)
    clearInterval(temporizador);
}
 
function disparar(){
  xDisparo = xNave;
  yDisparo = yNave;
  obj=document.getElementById("disparo");
  obj.style.left=xDisparo;     
  obj.style.top=yDisparo +"px";
  temporizador=setInterval("moverDisparo()",50);
}
</script>
</head>
 
<body  onkeydown="comprobarTeclas(event); ">
<p><img id="nave" src="nave.png" alt="nave" width="50" height="50" onclick="clearInterval(temporizador);fire()"> </p>
<p><img id="disparo" src="disparo.png" alt="disparo"  width="10" height="10"> </p>
<p>Pulse izquierda y derecha; Intro para disparar</p>
 
</body>
</html>