Differences

This shows you the differences between two versions of the page.

--- kurse:ef05a-2021:js:projekte:jumpnrun [2022/03/05 15:19] – created Ivo Blöchliger
+++ kurse:ef05a-2021:js:projekte:jumpnrun [2022/03/05 15:21] (current) – Ivo Blöchliger
@@ Line 1: / Line 1: @@
+====== Jump'n run ======
+  * Position von HTML-Elementen (img, div mit Inhalt, etc.).
+    * mit CSS ''position:absolute'' und mit ''left:10px'' und ''top:100px'' werden die Koordinaten eines Elements gesetzt. Direkt von Javascript aus: ''meinObjekt.style.left = 30;''
+  * Auslesen der Tasten: https://developer.mozilla.org/en-US/docs/Web/API/Document/keydown_event
+  * Am besten mit https://developer.mozilla.org/en-US/docs/Web/API/window/requestAnimationFrame arbeiten.
+<code javascript>
+let start;
+let loop = function(timestamp) {
+  if (start === undefined) {
+    start = timestamp;
+  }
+  const ms = timestamp - start; // Zeit in ms seit Spielbeginn
+  // Spielzustand updaten (Dinge verschieben, überprüfen, etc.), in Abhängigkeit der Zeit.
+  // Nächster Schritt
+  window.requestAnimationFrame(loop)
+};
+</code>
+==== Ideen ====
+  * Mehrere Transparente Bilder (png oder svg) überlagern und in unterschiedlicher Geschwindigkeit scrollen, um einen 3D-Effekt zu erzeugen.