snopsy Geschrieben 7. Mai 2004 Teilen Geschrieben 7. Mai 2004 Hi, bin gerade dabei eine HP mit einem MouseOver-Menü zu basteln. Die Die Menüpunkte bestehen als Grafiken. Es gibt nun 3 Zustände. Einmal das Start-Bild, dann das Bild, wenn man mit der Maus auf einen Link geht und dann noch ein Bild, wenn man einen Menüpunkt anklickt. Habe das Menu auch schon soweit fertig. Die Bilder werden im Kopf der Seite vorgeladen und dann nach über das <a-Tag gesteuert. Mein Problem ist nun, dass wenn ich auf einen Button klicke erhalte ich das entsprechende Bild, wenn ich nun aber die Maus von dem Bild wegbewege (also mouseOut) erhalte ich wieder das Startbild. Ich will aber, dass wenn ein Link angeklickt ist, der als aktiv angezeigt wird (also 3. Bild) hier muss dann das MouseOver und MouseOut nicht mehr gehen. Kann mir da jemand helfen, wie ich das hinbekomme? <script language="JavaScript"> <!-- Bild1Start= new Image(); Bild1Start.src = "menu/bild1.jpg" Bild1Over= new Image(); Bild1Over.src = "menu/bild1Hover.jpg" Bild1Click= new Image(); Bild1Click.src = "menu/bild1Click.jpg" Bild2Start= new Image(); Bild2Start.src = "menu/bild2.jpg" Bild2Over= new Image(); Bild2Over.src = "menu/bild2Hover.jpg" Bild2Click= new Image(); Bild2Click.src = "menu/bild2Click.jpg" function Bildwechsel(Bildnr,Bildobjekt) { window.document.images[Bildnr].src = Bildobjekt.src; } //--> </script> </head> <body marginleft="0" margintop="0" marginwidth="0" marginheight="0" style="margin:0px;"> <table border="0" cellspacing='0' cellpadding='7' style='border-collapse: collapse' bordercolor='#000000'> <tr> <td> <a href="Link1.htm" target="main" onmouseover="Bildwechsel(0,Bild1Over)" onmouseout="Bildwechsel(0,Bild1Start)" onClick="Bildwechsel(0,Bild1Click)"> <img src="menu/bild1.jpg" border="0"></a> </td> </tr> <tr> <td> <a href="Link2.htm" target="main" onmouseover="Bildwechsel(0,Bild2Over)" onmouseout="Bildwechsel(0,Bild2Start)" onClick="Bildwechsel(0,Bild2Click)"> <img src="menu/bild2.jpg" border="0"></a> </td> </tr> </table> schon mal vielen Dank Snopsy Zitieren Link zu diesem Kommentar Auf anderen Seiten teilen Mehr Optionen zum Teilen...
Sill-el-Mot Geschrieben 7. Mai 2004 Teilen Geschrieben 7. Mai 2004 Hi, erstmal ein frage: wofür übergibst du die bildnr? wenn ich mich nicht verguckt habe ist die immer gleich -> du kannst die direkt in der js-funktion eintragen. zum prob: ist ein bissl kopliziert, sollte aber funktionieren. mach für dein mouseover und mouseout event eine neue funktion und überprüf dann in dieser ob der link aktiv ist. wenn nicht geht mouseout und mouseover ansonsten behälts du das alte bild bei. jetzt musst du allerdings schauen, das du das startbild bei deinem aktiven link wieder lädst, wenn du auf einen anderen klickst. verständlich? :confused: Gruß Christian Zitieren Link zu diesem Kommentar Auf anderen Seiten teilen Mehr Optionen zum Teilen...
Noxy Geschrieben 7. Mai 2004 Teilen Geschrieben 7. Mai 2004 Ich poste dir einfach mal das Script, das ich verwende: <script language="javascript"> <!-- var path= "images/" var n = new Array(); var o = new Array(); var p = new Array(); var subject = new Array('clan','news','member'); var select = -1; var name2 = ""; var temp = 0; // Pre-load part. if (document.images) { for (i=0;i<subject.length;i++) { n[i] = new Image; n[i].src = path + subject[i] + "_n.gif" o[i] = new Image; o[i].src = path + subject[i] + "_o.gif"; p[i] = new Image; p[i].src = path + subject[i] + "_p.gif"; } } // The functions: first mouseover, then mouseout function over(no) { if (document.images && select != no) { document.images[subject[no]].src = o[no].src } } function out(no) { if (document.images && select != no) { document.images[subject[no]].src = n[no].src } } function clic(no) { if (document.images) { document.images[subject[no]].src = p[no].src temp = select; select = no; if (temp != -1) {out(temp)} } } //--> </script> <TR> <TD width=104 height=31> <A onmouseover="over(0)" onclick="clic(0)" onmouseout="out(0)" href="./clan/clan.html" target="text"> <IMG src="images/clan_n.gif" border=0 name="clan"></A></TD> </TR> Die Bilder heissen dann entsprechend clan_n.gif, clan_o.gif, clan_p.gif Zitieren Link zu diesem Kommentar Auf anderen Seiten teilen Mehr Optionen zum Teilen...
Empfohlene Beiträge
Dein Kommentar
Du kannst jetzt schreiben und Dich später registrieren. Wenn Du ein Konto hast, melde Dich jetzt an, um unter Deinem Benutzernamen zu schreiben.