nicht angemeldet
Dynamische Buttons!!!
Bei folgendem Quelltext kommt bei mir immer die Fehlermeldung das document[...] kein Objekt ist kann mir einer sagen warum?
<html>
<head>
<title>Verwiese</title>
<script language="JavaScript">
var inaktiv="hom";
function Wechsel(bildname,zustand)
{
if (inaktiv!=bildname)
{
if (zustand==1) document[bildname].src =bildname+"on.gif";
if (zustand==2) document[bildname].src =bildname+"out.gif";
if (zustand==3) {
document[inaktiv].src =inaktiv+"out.gif";
document[bildname].src = bildname+"click.gif";
inaktiv=bildname; }
}
return true; }
</script>
</head>
<body>
<a href="home.htm" target="rechts" onMouseOver="Wechsel('bild1',1);" onMouseOut="Wechsel('bild1',2);" onClick="Wechsel('bild1',3)">
<img src="hom.gif" name="hom" border="0" alt="Home"></a>
</body>
</html>
Danke
-
Alzheimer? Schizophrenie?
http://www.teamone.de/selfaktuell/forum/?m=130239&t=24967-
Alzheimer? Schizophrenie?
Wie unfreundlich!
Aber:
Du hast einen kleinen Fehler:
Du musst die Funktion so aufrufen:onmouseover="Wechsel('hom',2);"
Du hast statt dem Image-Name "hom" "Bild1" übergeben...
Grüsse,
Michael-
Danke
es kommen trotzdem noch Fehler<html>
<head>
<title>Verwiese</title>
<script language="JavaScript">var inaktiv="hom";
function Wechsel(bildname,zustand)
{
if (inaktiv!=bildname)
{
if (zustand==1) document[bildname].src =bildname+"on.gif";
if (zustand==2) document[bildname].src =bildname+"out.gif";
if (zustand==3) {
document.images.[inaktiv].src =inaktiv+"out.gif";
document.images.[bildname].src = bildname+"click.gif";
inaktiv=bildname; }
}
return true; }</script>
</head> // Muss hier auch .gif dabei sein(geht trotzdem nicht)
<body> vvv
<a href="home.htm" target="rechts" onMouseOver="Wechsel('homon',1);" onMouseOut="Wechsel('homout',2);" onClick="Wechsel('homclick',3)">
<img src="hom.gif" name="hom" border="0" alt="Home"></a>
</body>
</html>-
Moin
es kommen trotzdem noch Fehler
wundert mich nicht. Hast du Antjes Posting gelesen?
Swen
-
wundert mich nicht. Hast du Antjes Posting gelesen?
Nein hab ich nicht oder besser was ist das????
-
Moin,
Du kannst dich aber daran erinnern, deine Frage gestern schon mal gestellt zu haben? Du findest deinen gestrige Frage in diesem Forum wieder? Du hast die Antworten dazu gelesen?
Viele Grüße
Swen
-
Hallo Philipp,
wundert mich nicht. Hast du Antjes Posting gelesen?
Nein hab ich nicht oder besser was ist das????
ohje, ich frage lieber mal nicht nach deinem Alter,
du hättest dieses Posting auch noch mal als Mail erhalten, damit du morgen nicht wieder einen Thread anfangen mußt. Aber selbst das hast du noch nicht geschafft, dir eine Mailadresse zuzulegen.Ich erkläre alles noch einmal ganz langsam zum Mitscheiben und Mitspielen. Papier, Schere und Buntstifte bereit? Na dann kann es losgehen.
Step 1:
Du malst dir jetzt einen Button in grün auf, schreibst auf ihn bild1 und schneidest ihn aus.
Step 2:
Du malst dir jetzt einen Button in gelb auf, schreibst auf ihn bild1 und schneidest ihn aus.
Step 3:
Du malst dir jetzt einen Button in rot auf, schreibst auf ihn bild1 und schneidest ihn aus.
Step 4:
Du malst dir jetzt einen Button in grün auf, schreibst auf ihn bild2 und schneidest ihn aus.
Step 5:
Du malst dir jetzt einen Button in gelb auf, schreibst auf ihn bild2 und schneidest ihn aus.
Step 6:
Du malst dir jetzt einen Button in rot auf, schreibst auf ihn bild2 und schneidest ihn aus.
Step 7:
Du malst auf ein Blatt zwei leere Buttons. In den einen schreibst du bild1 und in den anderen bild2. Lasse ausreichend Platz zwischen beiden Buttons du brauchst ihn noch.
So genug gebastelt jetzt spielen wir.
Step 8:
Lege auf dem leeren Button bild1 den gelben Button bild1.
Step 9:
Lege auf dem leeren Button bild2 den roten Button bild2.
Zwischenfrage:
Woran erkennst du welchen Button du wohinzulegen hast?
Richtig, weil auf dem Button bild1 und bild2 steht. Das hast du feingemacht.
Step 10: Woher weiß JavaScript wer welcher Button ist?
Auch JavaScript muss gesagt bekommen, wer welcher Button ist.
Das machst du mit:<img .... name="bild1" ...> und <img ... name="bild2">
Step 11: Wir sagen JavaScript, nimm diesen Button.
<a .... onMouseOver="Wechsel('bild1',...);" onMouseOut="Wechsel('bild1',....);" onClick="Wechsel('bild1',...)">
Step 12: Gehe zum Button bild1. Lege gleich daneben den grünen Button mit der Aufschrift bild1. (Du hast doch Platz gelassen oder?)
Step 13: Jetzt wird es knifflig. Schiebe den gelben Button raus und den grünen rein.
Grün steht für mouseover.
Step 14: Jetzt schiebe den grünen Button wieder raus und den gelben rein.
Gelb steht für mouseout.
Step 15: Wiederhole Step 13 und 14 fünf mal.
Zwischenfrage: Woher weißt du, welchen Button du nehmen mußt?
Richtig, die Farben verraten es dir.
Step 16: JavaScript ist farbenblind. Wie sag ich JavaScript die Farbe?
Die versteckst du im Dateinamen des Bildes:
für die Farbe grün steht on
für die Farbe gelb steht outStep 17: Wie kriegt den nun JavaScript raus, welcher grüne oder gelbe Button genommen werden soll?
Auch hier versteckst du das im Dateinamen des Bildes
Für bild1 steht dann bild1
Für bild2 steht dann bild2Step 18: Zusammenfassung:
Die Dateinamen lauten für den Button bild1
bild1on.gif bild2on.gif
bild1out.gif bild2out.gifWie heißen die Bilder für den Zustand 3 wie Click?
richtig, ich wußte doch du kriegst das hin:
bild1click.gif bild2click.gif
Step 19: Wir üben mouseover und mouseout mit JavaScript:
function Wechsel(bildname,zustand)
{
if (zustand==1) document[bildname].src =bildname+"on.gif";
if (zustand==2) document[bildname].src =bildname+"out.gif";
}Step 19a)
du rufst die Funktion mit: Wechsel("bild1",1) auf:
getauscht wird jetzt:
document["bild1"].src="bild1"+"on.gif"
^^^^^^^^^^^^^^^^
das ist das gleiche wie:
document["bild1"].src="bild1on.gif"Step 19b)
du rufst die Funktion mit: Wechsel("bild1",2) auf:
getauscht wird jetzt:
document["bild1"].src="bild1"+"out.gif"
^^^^^^^^^^^^^^^^
das ist das gleiche wie:
document["bild1"].src="bild1out.gif"So kleine Pause. Du kannst dich erholen. Gleich gehts weiter.
Step 20: Du willst auch bild2 tauschen. Das hat den roten Button bild2.
Neeeeeeeeeeeeeiiiiiiiiiiiiiiiiiiiinnnnnnnnnnnnnnnnn. Hörst du das?
Jedesmal wenn du das versuchst wird das geschrien.Step 21: Wie schreit Javascript?
JavaScript ist eine würdevolle Sprache, sie schreit nicht, es sei denn du verhaust sie mit Fehlern. JavaScript tut einfach nichts.
Warum?
var inaktiv="bild2";
if (inaktiv!=bildname) {
}
Step 21 a)
Rufts du die Funktion mit Wechsel("bild1",1) auf, kuckt JavaScript erst mal nach. Ist bild1 inaktiv?
"bild2" gleich "bild1"
nö, ist nicht der Fall, mache was du sollst.Step 21 b)
Rufts du die Funktion mit Wechsel("bild2",1) auf, kuckt JavaScript erst mal nach. Ist bild2 inaktiv?
"bild2" gleich "bild2"
ja klar doch, nein, ich mache garantiert nichts wäre ja noch schönerStep 22: bild1 soll inaktiv und rot werden!
Nimm den roten Button bild2 weg und lege gelb drauf.
Nimm den grünen Button bild1 weg und lege rot drauf.
Zwischenfrage: Warum den grünen Button?
Denk nach, ist doch gar nicht so schwer.
Richtig, weil die mouse über den Button ist und du draufgeklickt hast.
Step 23: Das selbe jetzt in JavaScript:
Step 23 a) Mache rot zu gelb
Zur Erinnerung: inaktiv ist bild2
document[inaktiv].src =inaktiv+"out.gif";
ist das gleiche wie:
document["bild2"].src ="bild2out.gif";
und legt den gelben Button anstelle des roten Buttons hin.
Step 23 b) Mache grün zu rot
Zur Erinnerung: bildname ist bild1document[bildname].src = bildname+"click.gif";
ist das gleiche wie:
document["bild1"].src ="bild1click.gif";
Step 23 c) Sage JavaScript der erste Button ist rot.
Zur Erinnerung: bildname ist bild1inaktiv=bildname;
ist das gleiche wie:
inaktiv="bild1";
Step 24) Hausaufgaben:
Step 24 a) Erkläre, warum für dieses Script wenigstens 2 Button notwendig sind.
Step 24 b) Fertige zwei Sätze Buttons, mit denen du das oben beschriebende Verfahren anwenden kannst.
Step 24 c) Erweitere, dieses Beispiel auf 4 verschiedene Buttons bild1, bild2, bild3 und bild4.
Step 24 d) Stelle dein Ergebnis ins Web und zeige es uns.
So, 45 min um. Die Stunden ist zuende.
Viel Spaß bei den Hausaufgaben.
Viele Grüße
Antje Hofmann
-
Moin
So, 45 min um. Die Stunden ist zuende.
Danke, das hat Spaß gemacht zu lesen :-)
Viele Grüße
Swen
-
-
-
-
-
-