JavaScript Touchevents

RauchenderDachs

Cadet 4th Year
Registriert
Dez. 2012
Beiträge
70
Hallo Leute,

ich möchte ein kleines Spiel programieren. Das Spiel möchte ich mittels einer Web app realisieren. Dafür mlchte ich das sich erstmal ein kleines Schiffchen(Alien), per touch berührung auf einen gewissen Bereich(div "run") ,nach rechts bewegt.Dafür habe ich folgenden Code entwickelt.

Zu erst das Script:

Code:
var main = document.getElementById("main");//Mein Canvas auf dem ich Zeiche
var ctx = main.getContext("2d");



document.getElementById("run").addEventListener("touchstart", touchHandler, false);//run bezeichnet das Div auf das ich klicke um das Schiffchen zu bewegen
document.getElementById("run").addEventListener("touchmove", touchHandler, false);
document.getElementById("run").addEventListener("touchend", touchHandler, false);

function touchHandler(e) {
  if (e.type == "touchstart") {
    alert("You touched the screen!");
      console.log(1);
  } else if (e.type == "touchmove") {
    alert("You moved your finger!");
      console.log(1);
  } else if (e.type == "touchend" || e.type == "touchcancel") {
    alert("You removed your finger from the screen!");
      console.log(1);
  }
}

Das Zeichen übernimmt ein loop weiter unten.

hier noch der HTMl code:
HTML:
<!DOCTYPE html>
<html>
<head>
<meta charset="ISO-8859-1">
<link rel="stylesheet" type="text/css" href="style.css" >
<meta name="apple-mobile-web-app-capable" content="yes">
<title>Game</title>
</head>
<body>
<canvas id="main" style="border: black solid 1px;" width="500" height="500">
   
    </canvas>
<div id="run">
</div>
<script src ="game.js">
</script>
	
</body>
</html>

Mein Ziel ist es das sich bei Touchstart das Bild nach rechts bewegt bzw irgendwas passiert.

Zum Debugen nehm ich normalerweise Fierfox habs aber auch schon mit Opera und Chrome probiert ohne Erfolg.

Grüße RauchenderDachs
 
Eigentlich solltest du in Chrome/Chromium wirklich gut arbeiten können, da er von Haus aus verschiedene Emulationen, z.B. auch Touch-Emulation, unterstützt. Ansonsten kann ich dir nur raten, auf eines der beliebteren JavaScript - Frameworks zu setzen. Das erleichtert die Arbeit, verkürzt den selbst zu schreibenden Code enorm und vereinfacht Crossbrowser-Kaspereien.
 
Zurück
Oben