Programmiere das Spielfeld mit dem Zeichenkontext des canvas-Elements. Mit setTimeout sorgst du dafür, dass das Spiel 60-mal in der Sekunde „tickt“.
Illustrations © Duncan Beedie
All rights reserved.
Bücher bei Ullmann Medien > Programmieren für Kids > Programmieren für Kids – Band 2 > Mission 3: Tischtennis > Das Spielfeld
Programmiere das Spielfeld mit dem Zeichenkontext des canvas-Elements. Mit setTimeout sorgst du dafür, dass das Spiel 60-mal in der Sekunde „tickt“.
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<title>Tischtennis</title>
</head>
<body>
<canvas id="canvas" width="640" height="480"></canvas>
<script>
var canvas = document.getElementById("canvas");
var ctx = canvas.getContext("2d");
function tick() {
draw();
window.setTimeout("tick()", 1000/60);
}
function draw() {
ctx.fillStyle = "black";
ctx.fillRect(0, 0, 640, 480);
}
tick();
</script>
</body>
</html>
Diese Website verwendet Cookies, um Ihnen unseren Dienst bestmöglich bereitzustellen. Einige von ihnen sind essenziell, während andere uns helfen, diese Website und Ihre Erfahrung zu verbessern. Wenn Sie unter 16 Jahre alt sind und Ihre Zustimmung zu freiwilligen Diensten geben möchten, müssen Sie Ihre Erziehungsberechtigten um Erlaubnis bitten. Wir verwenden Cookies und andere Technologien auf unserer Website. Einige von ihnen sind essenziell, während andere uns helfen, diese Website und Ihre Erfahrung zu verbessern. Personenbezogene Daten können verarbeitet werden (z. B. IP-Adressen), z. B. für personalisierte Anzeigen und Inhalte oder Anzeigen- und Inhaltsmessung. Weitere Informationen über die Verwendung Ihrer Daten finden Sie in unserer Datenschutzerklärung. Sie können Ihre Auswahl jederzeit unter Einstellungen widerrufen oder anpassen.
Wenn Sie unter 16 Jahre alt sind und Ihre Zustimmung zu freiwilligen Diensten geben möchten, müssen Sie Ihre Erziehungsberechtigten um Erlaubnis bitten. Wir verwenden Cookies und andere Technologien auf unserer Website. Einige von ihnen sind essenziell, während andere uns helfen, diese Website und Ihre Erfahrung zu verbessern. Personenbezogene Daten können verarbeitet werden (z. B. IP-Adressen), z. B. für personalisierte Anzeigen und Inhalte oder Anzeigen- und Inhaltsmessung. Weitere Informationen über die Verwendung Ihrer Daten finden Sie in unserer Datenschutzerklärung. Hier finden Sie eine Übersicht über alle verwendeten Cookies. Sie können Ihre Einwilligung zu ganzen Kategorien geben oder sich weitere Informationen anzeigen lassen und so nur bestimmte Cookies auswählen.