Script funktioniert nicht mit Layern - warum?
Steve (Newbee)
- javascript
Ich habe folgendes Script für dynamische Buttons - soweit, so gut, das Ganze klappt auch einwandfrei. Sobald ich aber die Menübuttons in eine Layer lege, geht nichts mehr - weder der RollOver noch der OnClick. Weiß jemand warum? Achso, erstellt wurde das Ding mit GoLive 5 auf nem PowerMac G4 mit MacOS X... Getestet auf IE 4+5.1, NS 4.5+4.7
<html>
<head> <meta http-equiv="content-type" content="text/html;charset=ISO-8859-1"> <meta name="generator" content="Adobe GoLive 5"> <title>Willkommen bei Adobe GoLive 5</title> <script language="JavaScript"> if (document.images) { //navigation - imageobjekte var neuigkeiten_on = new Image(); var neuigkeiten_off = new Image(); var basics_on = new Image(); var basics_off = new Image(); var design_on = new Image(); var design_off = new Image(); var konzepte_on = new Image(); var konzepte_off = new Image(); var anfrage_on = new Image(); var anfrage_off = new Image(); var profil_on = new Image(); var profil_off = new Image(); var kontakt_on = new Image(); var kontakt_off = new Image(); var briefoeffner_on = new Image(); var briefoeffner_off = new Image(); var halter_on = new Image(); var halter_off = new Image(); var clickey_on = new Image(); var clickey_off = new Image(); var accessoires_on = new Image(); var accessoires_off = new Image(); var anhaenger_on = new Image(); var anhaenger_off = new Image(); var lesezeichen_on = new Image(); var lesezeichen_off = new Image(); var pins_on = new Image(); var pins_off = new Image();
//sources der einzelnen objekte neuigkeiten_on.src = "buttons/neuigkeitenon.jpg" neuigkeiten_off.src = "buttons/neuigkeiten.jpg" basics_on.src = "buttons/basicson.jpg" basics_off.src = "buttons/basics.jpg" design_on.src = "buttons/designon.jpg" design_off.src = "buttons/design.jpg" konzepte_on.src = "buttons/konzepteon.jpg" konzepte_off.src = "buttons/konzepte.jpg" anfrage_on.src = "buttons/anfrageon.jpg" anfrage_off.src = "buttons/anfrage.jpg" profil_on.src = "buttons/profilon.jpg" profil_off.src = "buttons/profil.jpg" kontakt_on.src = "buttons/kontakton.jpg" kontakt_off.src = "buttons/kontakt.jpg" briefoeffner_on.src = "buttons/briefoeffneron.jpg" briefoeffner_off.src = "buttons/briefoeffner.jpg" halter_on.src = "buttons/halteron.jpg" halter_off.src = "buttons/halter.jpg" clickey_on.src = "buttons/clickeyon.jpg" clickey_off.src = "buttons/clickey.jpg" accessoires_on.src = "buttons/accessoireson.jpg" accessoires_off.src = "buttons/accessoires.jpg" anhaenger_on.src = "buttons/anhaengeron.jpg" anhaenger_off.src = "buttons/anhaenger.jpg" lesezeichen_on.src = "buttons/lesezeichenon.jpg" lesezeichen_off.src = "buttons/lesezeichen.jpg" pins_on.src = "buttons/pinson.jpg" pins_off.src = "buttons/pins.jpg"
//deklaration der statusvariabeln - default alle auf 0 (nicht aktiv) //0...menue1 //1...menue2 //2...menue3 //3...menue4 //4...menue5 //5...menue6 var statusNavArray = new Array(); for (i=0; i<=6; i++) { statusNavArray[i] = 0; } }
function checkRollover(image, target, index) { if (document.images) { if (statusNavArray[index] != 1) { var imgOn = eval(image + ".src") document [target].src = imgOn } } } function springe1(URL) { parent.Main.location.href=URL; } function springe2(URL) { parent.Main.location.href=URL; } function checkStatus(index) {
if (document.images) {
//alle auf default 0 for (i=0; i<statusNavArray.length; i++) { statusNavArray[i] = 0; } statusNavArray[index] = 1;
//alle anderen menupunkt wieder deaktivieren if (index != 0) { checkRollover('neuigkeiten_off','neuigkeiten_off',0); } if (index != 1) { checkRollover('basics_off','basics_off',1); } if (index != 2) { checkRollover('design_off','design_off',2); } if (index != 3) { checkRollover('konzepte_off','konzepte_off',3); } if (index != 4) { checkRollover('anfrage_off','anfrage_off',4); } if (index != 5) { checkRollover('profil_off','profil_off',5); } if (index != 6) { checkRollover('kontakt_off','kontakt_off',6); } if (index != 7) { checkRollover('briefoeffner_off','briefoeffner_off',7); } if (index != 8) { checkRollover('halter_off','halter_off',8); } if (index != 9) { checkRollover('clickey_off','clickey_off',9); } if (index != 10) { checkRollover('accessoires_off','accessoires_off',10); } if (index != 11) { checkRollover('anhaenger_off','anhaenger_off',11); } if (index != 12) { checkRollover('lesezeichen_off','lesezeichen_off',12); } if (index != 13) { checkRollover('pins_off','pins_off',12); }
if (index == 0) { springe1(); } if (index == 1) { springe1(); } if (index == 2) { springe1(); } if (index == 3) { springe1(); } if (index == 4) { springe1(); } if (index == 5) { springe1(); } if (index == 6) { springe1(); } if (index == 7) { springe1(); } if (index == 8) { springe1(); } if (index == 9) { springe1(); } if (index == 10) { springe1(); } if (index == 11) { springe1(); } if (index == 12) { springe1(); } if (index == 13) { springe1(); }
if (index == 0) { springe2(); } if (index == 1) { springe2(); } if (index == 2) { springe2(); } if (index == 3) { springe2(); } if (index == 4) { springe2(); } if (index == 5) { springe2(); } if (index == 6) { springe2(); } if (index == 7) { springe2(); } if (index == 8) { springe2(); } if (index == 9) { springe2(); } if (index == 10) { springe2(); } if (index == 11) { springe2(); } if (index == 12) { springe2(); } if (index == 13) { springe2(); }
} } </script>
</head>
<body bgcolor="#ffffff"> <p><a href="#" onclick=checkStatus(0); onmouseout="checkRollover('neuigkeiten_off','neuigkeiten_off',0);" onmouseover="checkRollover('neuigkeiten_on','neuigkeiten_off',0);" target="Main"><img src="buttons/neuigkeiten.jpg" name="neuigkeiten_off" width="160" height="26" border="0" alt="Aktuelle News"></a> <p><a href="#" onclick=checkStatus(1); onmouseout="checkRollover('basics_off','basics_off',1);" onmouseover="checkRollover('basics_on','basics_off',1);" target="Main"><img src="buttons/basics.jpg" name="basics_off" width="160" height="26" border="0" alt="Basics"></a></p> <p><a href="#" onclick=checkStatus(2); onmouseout="checkRollover('design_off','design_off',2);" onmouseover="checkRollover('design_on','design_off',2);" target="Main"><img src="buttons/design.jpg" name="design_off" width="160" height="26" border="0" alt="Design"></a></p> <p><a href="#" onclick=checkStatus(3); onmouseout="checkRollover('konzepte_off','konzepte_off',3);" onmouseover="checkRollover('konzepte_on','konzepte_off',3);" target="Main"><img src="buttons/konzepte.jpg" name="konzepte_off" width="160" height="26" border="0" alt="Konzepte"></a></p> <p><a href="#" onclick=checkStatus(4); onmouseout="checkRollover('anfrage_off','anfrage_off',4);" onmouseover="checkRollover('anfrage_on','anfrage_off',4);" target="Main"><img src="buttons/anfrage.jpg" name="anfrage_off" width="160" height="26" border="0" alt="Anfrage"></a></p> <p><a href="#" onclick=checkStatus(5); onmouseout="checkRollover('profil_off','profil_off',5);" onmouseover="checkRollover('profil_on','profil_off',5);" target="Main"><img src="buttons/profil.jpg" name="profil_off" width="160" height="26" border="0" alt="Firmenprofil"></a></p> <p><a href="#" onclick=checkStatus(6); onmouseout="checkRollover('kontakt_off','kontakt_off',6);" onmouseover="checkRollover('kontakt_on','kontakt_off',6);" target="Main"><img src="buttons/kontakt.jpg" name="kontakt_off" width="160" height="26" border="0" alt="Kontakt"></a></p> <p><a href="#" onclick=checkStatus(7); onmouseout="checkRollover('briefoeffner_off','briefoeffner_off',7);" onmouseover="checkRollover('briefoeffner_on','briefoeffner_off',7);" target="Main"><img src="buttons/briefoeffner.jpg" name="briefoeffner_off" width="160" height="26" border="0" alt="Brieföffner"></a></p> <p><a href="#" onclick=checkStatus(8); onmouseout="checkRollover('halter_off','halter_off',8);" onmouseover="checkRollover('halter_on','halter_off',8);" target="Main"><img src="buttons/halter.jpg" name="halter_off" width="160" height="26" border="0" alt="Schlüsselhalter"></a></p> <p><a href="#" onclick=checkStatus(9); onmouseout="checkRollover('clickey_off','clickey_off',9);" onmouseover="checkRollover('clickey_on','clickey_off',9);" target="Main"><img src="buttons/clickey.jpg" name="clickey_off" width="160" height="26" border="0" alt="ClicKey"></a></p> <p><a href="#" onclick=checkStatus(10); onmouseout="checkRollover('accessoires_off','accessoires_off',10);" onmouseover="checkRollover('accessoires_on','accessoires_off',10);" target="Main"><img src="buttons/accessoires.jpg" name="accessoires_off" width="160" height="26" border="0" alt="Accessoires"></a></p> <p><a href="#" onclick=checkStatus(11); onmouseout="checkRollover('anhaenger_off','anhaenger_off',11);" onmouseover="checkRollover('anhaenger_on','anhaenger_off',11);" target="Main"><img src="buttons/anhaenger.jpg" name="anhaenger_off" width="160" height="26" border="0" alt="Schlüsselanhänger"></a></p> <p><a href="#" onclick=checkStatus(12); onmouseout="checkRollover('lesezeichen_off','lesezeichen_off',12);" onmouseover="checkRollover('lesezeichen_on','lesezeichen_off',12);" target="Main"><img src="buttons/lesezeichen.jpg" name="lesezeichen_off" width="160" height="26" border="0" alt="Lesezeichen"></a></p> <p><a href="#" onclick=checkStatus(13); onmouseout="checkRollover('pins_off','pins_off',13);" onmouseover="checkRollover('pins_on','pins_off',13);" target="Main"><img src="buttons/pins.jpg" name="pins_off" width="160" height="26" border="0" alt="Metall-Pins"></a></p> </body>
</html>
Herrje, die Info war noch net vollständig...
es handelt sich genauer gesagt um 2 Layer - die erste enthält 7 Buttons, die zweite ebenfalls. Die zweite Layer wird aber über die Buttons in der ersten ein- bzw. ausgeblendet. Ohne Layers funktionieren alle Buttons, in den Layers geht nichts mehr :(
re:Hi.
vorweg: das naechste mal wuerde vielleicht auch eine gekuerzte version deines scriptes reichen.
zu deiner frage: versuch doch mal dem layer nen namen zu geben und dann ueber document.layername.document[bla].src die bilder anzussprechen. zumindest bei Netscape gelten layer als eigenes document.
zur verbesserung: worin besteht der unterschied zw. springe1(URL) und springe2(URL)?
gruss,
frank_eee.
Zuallererst vielen Dank für deine Antwort Frank.
Wie gesagt, ich bin ziemlich neu bei der ganzen Sache und werde mir Deinen Rat mit "etwas weniger Skript" gerne zu Herzen nehmen :)
Die beiden "springe1(URL)" und "springe2(URL) hab ich im Skript, weil ich in dem fertigen Frameset dann 2 Frames updaten möchte - ich denke, so funktionierts ?! Werd gleich nochmal im Forum kucken, ob das vielleicht etwas umständlich ist...
Danke nochmals.
STEVE