Viktor: onmouseover/out/click mit nur 2 Grafiken

Beitrag lesen

Hi,

ich bin beim servern über ein tolles JavaScript gestolpert. Das ursprüngliche Programm machte folgendes. Man hat 3 Buttons. Beim drüberfahren mit der Maus erscheint Button2 und beim clicken Button3. Buttons bleibt dann so lange aktiviert, bis man auf einen anderen Button klickt. Beispiel findet ihr unter : http://screenexa.net/js_notiz/tips/change.htm

So, so weit so gut. Da mein Provi eh nicht der aller schnellste ist, dachte ich mir, für was brauch in 3 Buttons. Es reicht ein "inaktiver" Button und ein Button für mouseover UND onclick.
Das sollte dann so aussehen. "inakt" Button wird geladen. Wenn man mit der Maus drüber fährt wird Button2 angezeigt und bei draufklicken bleibt der Button2 stehen.

Ich wollt das so machen:

Zur weiteren Erklärung. "inakt"Button ist hier grün.gif und Button2 ist hier rot.gif

<HTML>
<HEAD>
<TITLE></TITLE>
<SCRIPT LANGUAGE = "JavaScript">
<!--
// Bilder vorladen
if (document.images)
{
   gruenImage = new Image()  
   gruenImage.src = "gruen.gif"
   rotImage = new Image()  
   rotImage.src = "rot.gif"
}

// Statustext anzeigen, Button rot

function statusein(Bild,text)
{
   window.status = text;
   if (document.images)
   {
      if (Bild.src == gruenImage.src)
         Bild.src = rotImage.src;
   }
}

// Statustext aus, Button gruen

function statusaus(Bild)
{
   window.status="";
   if (document.images)
   {
      if (Bild.src == rotImage.src)
        Bild.src = gruenImage.src;
   }
}

// aktuellen Link kennzeichnen
// dazu alle Buttons gruen, dann
// Button gewaehlter Link rot

function gewaehlt(Bild)
{
   if (document.images)
   {
      for (i=0; i<document.images.length; i++)
       document.images[i].src = gruenImage.src;
       Bild.src = rotImage.src;
   }  
}
// -->
</SCRIPT>

<BODY BGCOLOR="#000000" TEXT="#C0C0C0" LINK="#00FFFF" VLINK="#FFFFFF" ALINK="#6666FF">

<TABLE CELLSPACING=4 CELLPADDING=0 BORDER=0>
<TR>
<TD>
<A HREF="unterlink.html" TARGET="anzeige" onmouseover = "statusein(document.Bild1,'Seite 1'); return true" onmouseout="statusaus(document.Bild1)" onclick="gewaehlt(document.Bild1)">
<IMG SRC="gruen.gif" NAME="Bild1" BORDER=0></A>
</TD>
<TD>
</TD>
</TR>
<TR>
<TD>
<A HREF="unterlink.html" TARGET="anzeige" onmouseover = "statusein(document.Bild2,'Seite 2'); return true" onmouseout="statusaus(document.Bild2)" onclick="gewaehlt(document.Bild2)">
<IMG SRC="gruen.gif" NAME="Bild2" BORDER=0></A>
</TD>
<TD>
<TR>
<TD>
</TD>
<TD>
</TD>
</TR>
</TABLE>
</BODY>
</HTML>

Was ich noch sagen wollte, von JavaScript verstehe ich leider nichts.

Wer kann mir da weiter helfen??? Wie es NICHT geht, könnt ihr hier sehen http://134.2.52.70/viktor/test/

Gruß

Viktor