|
Projekt:
www.die-virtuelle-schule.de
|
Hans-Dieter Mallig
Im November 2000
Einführung in die
Markierfunktion beim Quiz
Autor der Javascript-Quiz-Module ist Thomas
Gebhardt
Es wird vorausgesetzt, dass sie bereits die Einführung
in QUIZ (Grundlagen) bearbeitet haben.
Öffnen sie mit
dem Browser (Internet-Explorer/ Netscape) die Datei demBquiz.html,
raten sie sich durch das Quiz und sammeln sie dabei erste Erfahrungen.
Wir schauen uns den Quellcode von demBquiz.htm im Editor
Wordpad an.
(Hier wird nur die
Markierfunktion in Bildern betrachtet)
-
Öffnen sie mit dem Editor Wordpad
die Datei demBquiz.html (Dateiformat
auf *.* einstellen) und versuchen sie sich zu orientieren. Ziemlich schwer,
gell?
-
Öffnen sie mit dem Browser Netscape
die Datei qzDEB100.html. Hier sind zur Demonstration
die Textpassagen, die sich auf die Markierung der Bildstellen beziehen
und die man gegebenenfalls ändern muss, farblich dargestellt (Im
reinen Quellcode kann man keine Stellen farblich markieren, deshalb diese
Demoversionen).
Eigenes Quiz mit Bild-Markierfunktion
Vorgehensweise:
-
(Kopieren sie die Dateien quiz.html, quiz1.html
und quiz.js in ihr (Arbeits-)Verzeichnis
-
Öffnen sie die mit dem Editor Wordpad die
Datei quiz.html
-
Speichern sie die Datei unter einem neuen Namen
(Z.B. aaaaaa.html)
-
Ändern sie gegebenenfalls var ENDEURL="
-
Löschen sie in einer der
Fragezeilen sämtlichen Text zwischen allen Anführungszeichenpaaren.
-
Kopieren sie zwischen das erste Anführungszeichenpaar
sinngemäß: <b>Wo liegt Costa
Rica ?</b> Klicken Sie auf die Karte.<p><img src=worldmap.gif
border=0 usemap=\"#x\"><map name=\"x\"><area shape=\"polygon\" coords=\"105,117,122,129,134,118,121,103\"
href=\"javascript:window.parent.bild(1);\"><area shape=\"circle\" coords=\"0,0,1000\"
href=\"javascript:window.parent.bild(2);\"></map>
-
Für
<b>Wo liegt Costa Rica ?</b> Klicken
Sie auf die Karte.<p> schreiben
sie ihren eigenen Fragetext.
-
Für worldmap.gif
tragen sie den Namen ihrer Abbildung (im gleichen Verzeichnis) ein.
-
Die 105,117,122,129,134,118,121,103
Koordinaten ersetzen sie durch die selbst ermittelten:
-
Dazu laden sie ihre Bilddatei mit einem
Graphikprogramm (z.B. Paint), fahren mit der Spitze des Mauszeigers zu
den Eckpunkten eines gedachten "Lösungsvielecks". Für jeden Punkt
dieses Polygons können sie (zweite Bildschirmleiste unten, rechts)
die Koordinaten ablesen und übertragen.
-
Sie nummerieren die 'Fragezeilen' mit 0 beginnend
durch.
-
Sie tragen bei this.length=? die Anzahl ihrer
Fragen ein.
-
Speichern sie die nun geänderte Datei erneut.
-
Schauen sie sich das Ergebnis im Browser an (Sie
öffnen aaaaaa.html mit Netscape)
Achtung! In Ihrem fortlaufenden Frage-Text
dürfen keine zusätzlichen doppelten Anführungszeichen und
kein Zeilenumbruch (Enter) sein, sonst funktioniert das Quiz nicht.
Übung:
-
Ihre Frage könnte heißen:
Kennst du die Welt? Klicke auf
Costa Rica (Spanien, Florida, Südafrika usw)
-
Sie bestimmen dazu mit Paint die Eck-Koordinaten
auf der Abbildung der Weltkarte
Viel Erfolg!
[Zurück zur Einführung in: JavaScript-Module,
Erstellung von Materialien
]