2026-10-06 14:18:57 +02:00
parent c1af899035
commit 7d06d95ab6
35 changed files with 1010 additions and 0 deletions
@@ -0,0 +1,41 @@
+<!DOCTYPE html>
+<html lang="de">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Übung 10 - Chasing Lights</title>
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.7/dist/css/bootstrap.min.css" rel="stylesheet" />
+    <link rel="stylesheet" href="assets/css/main.css" />
+    <script src="assets/js/main.js" defer></script>
+  </head>
+  <body>
+    <div class="container py-5">
+      <div class="alert alert-primary">
+        <h2>Übung 10 - Chasing Lights</h2>
+
+        <p>
+          Eine erste Variante sind die chasing Lights. Dabei muss der Anwender das Lauflicht mit der Maus »jagen«. Immer
+          wenn der Mauszeiger sich über einer Glühbirne befindet, schaltet sich die nächste Birne ein und die aktuelle
+          aus. Versucht der Benutzer, mit dem Mauszeiger die leuchtende Glühbirne zu berühren, springt das Licht auf die
+          nächste über. Er »jagt« quasi das Lauflicht. Bei der letzten Lampe beginnt das Spiel wieder von vorn!
+        </p>
+        <p>
+          Programmiere ein weiteres Lauflicht. Diesmal soll das Lauflicht weiterspringen, wenn der Benutzer auf eine der
+          Lampen klickt. Auch hier gilt: Nach der letzten Lampe fängt das Licht wieder von vorn an zu laufen.
+        </p>
+      </div>
+      <div class="light-bulbs">
+        <img src="assets/img/light_on.png" alt="lightbulb" />
+        <img src="assets/img/light_off.png" alt="lightbulb" />
+        <img src="assets/img/light_off.png" alt="lightbulb" />
+        <img src="assets/img/light_off.png" alt="lightbulb" />
+        <img src="assets/img/light_off.png" alt="lightbulb" />
+        <img src="assets/img/light_off.png" alt="lightbulb" />
+        <img src="assets/img/light_on.png" alt="lightbulb" />
+        <img src="assets/img/light_off.png" alt="lightbulb" />
+        <img src="assets/img/light_off.png" alt="lightbulb" />
+        <img src="assets/img/light_off.png" alt="lightbulb" />
+      </div>
+    </div>
+  </body>
+</html>