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:
Das Zeichen übernimmt ein loop weiter unten.
hier noch der HTMl code:
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
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