nicht angemeldet
Imagemap bei Klick einfärben
1 0 0 
Auge
Imagemap bei Klick einfärben
Hallo zusammen,
zunächst einmal muss ich sagen, dass ich in Bezug auf HTML/PHP absoluter Anfänger bin. Da ich die gestellte Aufgabe jedoch bis Donnerstag fertig haben muss, habe ich mich nun entschlossen gleich mal hier zu posten. Ich habe zwar kurz gesucht, jedoch auf die schnelle nicht das passende gefunden. Die Aufgabenstellung sieht folgendermaßen aus:
Auf einer Webseite wird oben in der Mitte ein Dreieck dargestellt, welches ein Koordinatensystem darstellt. Diesem Dreieck sind noch weitere kleinere Dreieecke einbeschrieben. Nun werden der Reihe nach Fragen gestellt. Als Antwort auf diese Fragen klickt man eines der oberen kleinen Dreiecke an. Es wird dann jeweils in eine Datei geschrieben, welches Dreieck angeklickt wurde.
Das ganze funktioniert nun soweit eigentlich problemlos. Für das Dreieck habe ich ein normales jpg-Bild erstellt, auf dem das Dreieck mit den kleineren Dreiecken zu sehen ist. Über eine Imagemap habe ich dann die kleineren Dreiecke definiert, um dann in die Datei zu schreiben, welches Dreieck jeweils geklickt wurde. Das Problem ist jetzt noch, dass das jeweils angeklickte Dreieck bei einem Klick eingefärbt werden soll und diese Einfärbung auch über die ganzen Fragen hinweg erhalten bleiben soll.
Nun meine Frage: Wie kann ich das mit der Einfärbung lösen? Nochmal sorry, dass ich evtl. hier eine dumme Frage stelle, aber ich brauche die fertige Seite bis Donnerstag, besser noch bis Mittwoch.
Hier mal mein bisheriger Code (Dem Skript wird von einer vorherigen Seite per "POST" der Username übergeben):
<?php
if (isset($_POST['user'])){
setcookie('user', $_POST['user']);
setcookie('fragenr',1);
}
if (isset($_COOKIE['fragenr'])){
setcookie('fragenr', ++$_COOKIE['fragenr']);
}
?>
<html>
<head>
<title>Test</title>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
</head>
<body>
<?php
# if(isset($_COOKIE['user'])){
# echo "Hallo ". $_COOKIE['user']."! Bitte nehmen Sie hier an unserer Umfrage teil!";}
# if (isset($_POST['user'])){
# echo "Hallo ". $_POST['user']."! Bitte nehmen Sie hier an unserer Umfrage teil!";}
$Bildbeschriftung=' <pre align="center">
Kooperation Fertigungstiefe Ergebnis
</pre>';
$nextpage='fragenbogen';
$imagemap= '
<p><h1 align="center">COBIT</h1></p>
<p align="center">Individuell</p>
<p align="center">
<img src="Dreieck.jpg" width="660" height="349" border="0" alt="Karte" usemap="#Landkarte">
<map name="Landkarte">
<area shape="poly" coords="330,0,330,170,165,170"
href="'.$nextpage.'.php?poly=1" alt="Dreieck1" title="Dreieck1">
<area shape="poly" coords="165,170,330,170,330,340"
href="'.$nextpage.'.php?poly=2" alt="Dreieck2" title="Dreieck2">
<area shape="poly" coords="165,170,330,340,165,340"
href="'.$nextpage.'.php?poly=3" alt="Dreieck3" title="Dreieck3">
<area shape="poly" coords="165,170,165,340,0,340"
href="'.$nextpage.'.php?poly=4" alt="Dreieck4" title="Dreieck4">
<area shape="poly" coords="330,0,330,170,495,170"
href="'.$nextpage.'.php?poly=5" alt="Dreieck5" title="Dreieck5">
<area shape="poly" coords="330,170,495,170,330,340"
href="'.$nextpage.'.php?poly=6" alt="Dreieck6" title="Dreieck6">
<area shape="poly" coords="330,340,495,340,495,170"
href="'.$nextpage.'.php?poly=7" alt="Dreieck7" title="Dreieck7">
<area shape="poly" coords="495,170,495,340,660,340"
href="'.$nextpage.'.php?poly=8" alt="Dreieck8" title="Dreieck8">
</map>
</p>'.$Bildbeschriftung;
# }
if (empty($_COOKIE['fragenr'])){
echo "Hallo ". $_POST['user']."! Bitte nehmen Sie hier an unserer Umfrage teil!";
echo $imagemap;
echo 'COBIT Perspektive 1';
}
switch($_COOKIE['fragenr']){
case 2:
echo "Hallo ". $_COOKIE['user']."! Bitte nehmen Sie hier an unserer Umfrage teil!";
echo $imagemap;
echo 'COBIT Perspektive 2';
break;
case 3:
echo "Hallo ". $_COOKIE['user']."! Bitte nehmen Sie hier an unserer Umfrage teil!";
echo $imagemap;
echo 'COBIT Perspektive 3';
break;
case 4:
echo "Hallo ". $_COOKIE['user']."! Bitte nehmen Sie hier an unserer Umfrage teil!";
echo $imagemap;
echo 'COBIT Perspektive 4';
break;
case 5:
echo "Hallo ". $_COOKIE['user']."! Bitte nehmen Sie hier an unserer Umfrage teil!";
echo $imagemap;
echo 'COBIT Perspektive 5';
break;
case 6:
echo "Hallo ". $_COOKIE['user']."! Bitte nehmen Sie hier an unserer Umfrage teil!";
echo $imagemap;
echo 'COBIT Perspektive 6';
break;
case 7:
echo "Hallo ". $_COOKIE['user']."! Bitte nehmen Sie hier an unserer Umfrage teil!";
echo $imagemap;
echo 'COBIT Perspektive 7';
break;
case 8:
echo "Hallo ". $_COOKIE['user']."! Bitte nehmen Sie hier an unserer Umfrage teil!";
echo $imagemap;
echo 'COBIT Perspektive 8';
break;
case 9:
echo "Hallo ". $_COOKIE['user']."! Bitte nehmen Sie hier an unserer Umfrage teil!";
echo $imagemap;
echo 'COBIT Perspektive 9';
break;
case 10:
echo "Hallo ". $_COOKIE['user']."! Bitte nehmen Sie hier an unserer Umfrage teil!";
echo $imagemap;
echo 'COBIT Perspektive 10';
break;
case 11:
echo "Hallo ". $_COOKIE['user']."! Bitte nehmen Sie hier an unserer Umfrage teil!";
echo $imagemap;
echo 'COBIT Perspektive 11';
break;
case 12:
echo 'Umfrage vorbei! Um die Umfrage erneut auszuführen schließen Sie bitte den Browser und starten Sie die Anwendung neu.';
break;
}
if (isset ($_COOKIE['user'])){
$file = fopen($_COOKIE['user'].'.csv', 'a');
fwrite($file, $_REQUEST['poly'].';');
fclose;
}
if ((isset($_REQUEST['poly']))){
echo "<br />Sie haben Dreieck ", $_REQUEST['poly']," angeklickt!";
}
?>
</body>
</html>
Vielen Dank schonmal für eure Hilfe!
Gruß
Roland
-
Hello,
Nun meine Frage: Wie kann ich das mit der Einfärbung lösen?
Einfärbung bedeutet: anderer Zustand
Anderer Zustand bedeutet: anderes BildAlso erzeuge dir für jeden Zustand ein eigenes Bild und binde dann nur die Bilder ein, die den einzelnen Zustaänden passen...
Liebe Grüße aus dem schönen Oberharz
Tom vom Berg
-
Hello,
Nun meine Frage: Wie kann ich das mit der Einfärbung lösen?
Einfärbung bedeutet: anderer Zustand
Anderer Zustand bedeutet: anderes BildAlso erzeuge dir für jeden Zustand ein eigenes Bild und binde dann nur die Bilder ein, die den einzelnen Zustaänden passen...
Liebe Grüße aus dem schönen Oberharz
Tom vom Berg
»»
Hi,
ich danke für deine Antwort. Habe mittlerweile eine Lösung gefunden. Habe ein weiteres Skript geschrieben, dass mir das Bild jedesmal, wie du gesagt hast, automatisch generiert.
Danke nochmal!
MfG
Roland-
Hallo
Nun meine Frage: Wie kann ich das mit der Einfärbung lösen?
Einfärbung bedeutet: anderer Zustand
Anderer Zustand bedeutet: anderes BildAlso erzeuge dir für jeden Zustand ein eigenes Bild und binde dann nur die Bilder ein, die den einzelnen Zustaänden passen...
ich danke für deine Antwort. Habe mittlerweile eine Lösung gefunden. Habe ein weiteres Skript geschrieben, dass mir das Bild jedesmal, wie du gesagt hast, automatisch generiert.
Wieso jedesmal? Wieso willst du (vermutlich) dem Server immer wieder die gleiche Arbeit aufhalsen? Erstelle die nötigen Bilder *einmal* und tausche sie per JavaScript oder noch _viel_ besser mit CSS (ein http://de.selfhtml.org/css/eigenschaften/hintergrund.htm#background_image@title=Hintergrundbild je http://de.selfhtml.org/css/eigenschaften/pseudoformate.htm#link_visited_focus_hover_active@title=Linkzustand evtl. mit http://de.selfhtml.org/css/eigenschaften/innenabstand.htm@title=padding für den Abstand Text-Bild) aus.
Tschö, Auge
--
Verschiedene Glocken läuteten in der Stadt, und jede von ihnen vertrat eine ganz persönliche Meinung darüber, wann es Mitternacht war.
Terry Pratchett, "Wachen! Wachen!"
Veranstaltungsdatenbank Vdb 0.3
-
-