Unterschiede

Hier werden die Unterschiede zwischen zwei Versionen angezeigt.

--- en:modul:m291:learningunits:lu06:loesungen:03 [2025/04/25 13:03] – angelegt vdemir
+++ en:modul:m291:learningunits:lu06:loesungen:03 [2025/05/04 11:37] (aktuell) – vdemir
@@ Zeile 1: / Zeile 1: @@
-====== LU06.S023 - Events - mouseclick and mouseover ======
+====== LU06.S03 - Events - mouseclick and mouseover ======
+===== Code-Solution =====
+{{ :en:modul:m291:learningunits:lu06:loesungen:lu06.s03.zip | Codesolution }}
 ===== Assignments  ======
-  - Test the code example provided to you. Describe the behaviour of the script using HTML comments.
+  - Take the solution from the previous assignment and name it correctly including the <h1>: **lu06.s03.html**
-  - Make sure that you have the title <h1> correctly named: **lu06.s02.html**
+  - Add another button **+2 Moose** which counts up by **step-size 2**, but use this time the event **@click.right=....**
-  - Change the caption of the //Moose-Button// to **+ 1 Moose **.
+  - Add another button **-2 Moose** which counts down by **step-size 2**, and use this thime the event **@click.left=....**
-  - Similiarily to the //Moose-Button// add another button **-1 Moose**which counts down.
+  - Add finally a mouseover event to the image by using the event **v-on:mouseover**: it resets the counter when the mouse moves over the image
-  - Add another 2 buttons **+5 Moose** and **-5 Moose** which count up respectively down by **step-size 5**
-  - Add another 2 buttons **+10 Moose** and **-10 Moose** which count up respectively down by **step-size 10**
+{{:en:modul:m291:learningunits:lu06:loesungen:lu06.s03_1.png?1000|Solution executed in the W3School-Sandbox}}
-  - Add another button **Reset** which resets the **counter to 0**.
-  - Save your script in webstorm in the directory **06_events** and adjust the path to the image.
+{{:en:modul:m291:learningunits:lu06:loesungen:lu06.s03_2.png?1000|Solution in Webstorm editor}}
-  - Test your script for correctness
-{{:en:modul:m291:learningunits:lu06:loesungen:lu06.s02_1.png| Solution executed in the W3School-Sandbox}}
-{{:en:modul:m291:learningunits:lu06:loesungen:lu06.s02_2.png| Solution executed in the Webstorm}}