tobias wall: mouseover / onclick über mehrer frames

hallo  -habe folgendes problem:

bei einem frameset mit drei frames möchte ich im oberen eine navigationsleiste aus bildern erstellen, die bei mouseover sich ändern. bei einem klick soll dann ein anderes bild stehenbleiben. (damit man weiss, in welcher rubrik man ist beim navigieren). dieses bild soll stehenbleiben, bis ich auf eine andere rubrik geklickt habe.

in einem zweiten frame ist ein größeres bild zu sehen, was die rubrik versinnbildlichen soll. (im ersten zustand ist nur ein weisses bild dort). dieses bild wird durch das mouseover des ersten frames gesteuert. bei onclick bleibt ein bild stehen. allerdings sollte hier dann bei einem neuen mouseover auch ein bildwechsel erfolgen (nicht erst bei einem neuen onclick), allerdings dann bei mouseout wieder zu dem bild zurückspringen, wo man war (wenn man also keine neue kategorie gewählt hat...)

im dritten frame sind die inhaltsseiten, die durch den ersten frame angesteuert werden

---

mit dem quelltext unten klappt das ganz gut, bis auf:

  • nach dem onclick verschwindet im ersten frame das onclick-bild  durch erneutes mouseover, und nicht erst durch ein neues onclick
  • und im zweiten frame bleibt das bild nicht stehen, bzw kommt nicht wieder, wenn ich ge-mouse-overt habe ohne ein neuen onclick auszuführen.

---

leider konnte ich im forum auch keine passende bisherige antwort finden, sondern immer nur antworten auf teile meines problems. freue mich über eure ideen und hoffe dadurch ein paar haare weniger grau werden zu lassen ;-)

danke, jens

---

<HTML>

<HEAD>

<SCRIPT LANGUAGE = "JavaScript">

<!--

if (document.images) {

<!-- mouseoverbilder im ersten frame -->
            img1on = new Image();
            img1on.src = "link1_on.gif";
            img2on = new Image();
            img2on.src = "link2_on.gif";
            img3on = new Image();
            img3on.src = "link3_on.gif";

<!-- mouseoutbilder im ersten frame -->
            img1off = new Image();
            img1off.src = "link1_off.gif";
            img2off = new Image();
            img2off.src = "link2_off.gif";
            img3off = new Image();
            img3off.src = "link3_off.gif";

<!-- mouseoverbilder im zweiten frame -->
            img1ad = new Image();
            img1ad.src = "2link1_on.gif";
            img2ad = new Image();
            img2ad.src = "2link2_on.gif";
            img3ad = new Image();
            img3ad.src = "2link3_on.gif";

<!-- onclick bilder im ersten frame-->
            img1click = new Image();
            img1click.src = "clic1.gif";
            img2click = new Image();
            img2click.src = "clic2.gif";
            img3click = new Image();
            img3click.src = "clic3.gif";

<!-- onclick bilder im zweiten frame-->
            img1click2 = new Image();
            img1click2.src = "2clic1.gif";
            img2click2 = new Image();
            img2click2.src = "2clic2.gif";
            img3click2 = new Image();
            img3click2.src = "2clic3.gif";

}

function imgOn(imgName) {
        if (document.images) {
            document[imgName].src = eval(imgName + "on.src");
            parent.B.document.images['common'].src = eval(imgName + "ad.src");
        }
}

function imgOff(imgName) {
        if (document.images) {
            document[imgName].src = eval(imgName + "off.src");
            parent.B.document.images["common"].src = "dircommon.gif";
        }
}

function imgClick(imgName) {
        if (document.images) {
                document[imgName].src                  = eval(imgName + "click.src");
                parent.B.document.images["common"].src = eval(imgName + "click2.src");
        }
}

// -->

</SCRIPT>

<TITLE>links</TITLE>
</HEAD>

<BODY BGCOLOR="#cfcfcf" TEXT="#000000" >

<center><br>

<TABLE  BORDER=0 CELLPADDING=0 CELLSPACING=0>

<Td>
<A HREF="1.html" target="c"
onMouseOver = "imgOn('img1')"
onMouseOut = "imgOff('img1')"
onClick = "imgClick('img1')">

<IMG SRC="link1_off.gif" NAME="img1"   BORDER="0" >
</A></Td>

<Td>
<A HREF="2.html" target="c"
onMouseOver = "imgOn('img2')"
onMouseOut = "imgOff('img2')"
onClick = "imgClick('img2')">

<IMG SRC="link2_off.gif" NAME="img2"  BORDER="0"  >
</A></Td>

<Td>
<A HREF="3.html" target="c"
onMouseOver = "imgOn('img3')"
onMouseOut = "imgOff('img3')"
onClick = "imgClick('img3')">

<IMG SRC="link3_off.gif" NAME="img3"   BORDER="0"  >
</A>
</Td>

</BODY>
</HTML>

  1. Hi,

    die Problematik kommt mir sehr bekannt vor. Bevor ich den riesigen Sourcecode für eine mögliche Lösung poste, gebe ich doch lieber den Link eines Projektes von mir an: www.berlebach.de

    Einfach den Quelltext im obigen Nav-Frame anschauen. Ist eigentlich ziemlich leicht zu verstehen ;-)

    Über die zusätzliche Funktion wahl() wird die Grafik für den aktuell gewählten Menüpunkt gesteuert. Der Bildwechsel zwischen onmouseover und onmouseout wird über nur eine Funktion Bildwechsel() realisiert. Der entscheidende Punkt ist, die richtige Codierung für die Bilder zu wählen.

    Der Code fällt aber eher in die Rubrik copy and paste :-)

    bye

    Michael

    1. hi michael - danke für die antwort. habe mir deine - übrigens vom design her wie ich finde sehr angenehme - seite angeschaut. allerdings nun der dumme haken: die ganze sache mit einem frame hinzubekommen klappt bei einer anderen website von mir schon ganz gut. nur versuche ich das ganze jetzt in zwei frames. ...und da trete ich auf der stelle. ...vielleicht hast du ja noch eine weitere seite im angebot mit der lösung???? *grosse hoffnung...*

      danke erst mal....