Damit das Spiel auf der Seite dargestellt wird, müssen wir den HTML-Code der Seite erweitern.
Zunächst benötigen wir ein neues Steuerelement im Element mit der id="steuerung".
Hier kannst du einfach ein Bild-Element anlegen, dass die Grafik sspes.png auf der Seite darstellt.
Das Bild bekommt ein Event-Attribut onclick, das die Funktion oeffneSSP() aufruft.
Außerdem muss natürlich ein Bereich erstellt werden, in dem das Spiel angezeigt wird. Dieser sollte sich unter der Steuerung befinden.
In diesem Bereich befinden sich zunächst auch Steuerelemente (Bilder) für Schere, Stein und Papier.
Jedes Bild enthält ein Event-Attribut onclick, das die Funktion spieleSSP() aufruft und für Schere die Zahl 1, bei Papier die Zahl 2 und bei Stein die Zahl 3 übergibt.
Es folgt ein Bereich für den Showdown, in dem das Ergebnis des Spiels, d.h. die Auswahl des Spielers und die des Gegners jeweils als Grafik dargestellt wird.
Außerdem benötigen wir einen Absatz, um darin das Ergebnis zu verkünden.
Zum Schluss des Dialogs gibt es noch einen Button, der onclick die FUnktion schliesseSSP() aufruft.
Die Elemente, die später zur Ausgabe genutzt oder speziell mit CSS formatiert werden müssen, erhalten eine eindeutige id.
