Siegi Müller: Suche simples Rollover Menü mit Text / CSS (ohne a:hover!)

Hi,
Kennt jemand ein Script für ein textbasiertes simples Menü, bei dem die aktiven Links mit CSS formatiert werden?
Soll in einem Frameset funktionieren: wenn ich auf einen Menüpunkt klicke, soll er sich umfärben (und im zweiten Frame die Seite laden), wenn ich auf einen anderen Menüpunkt klicke, wird der erste zurückgesetzt und der zweite gefärbt usw.)

Klingt relativ simpel - hab aber noch nirgends was so einfaches gefunden (jede Menge Ausklapp-, Einblend-, Popauf-Menüs...)

Ich weiss: Man kann das ganze mit Formatierung für a:hover / a:active usw. machen; das Problem dabei ist: wenn man ausserhalb des Menüs klickt, ist die Formatierung des aktiven Menü-Links weg :-(

  1. Moin,

    Ich weiss: Man kann das ganze mit Formatierung für a:hover / a:active usw. machen; das Problem dabei ist: wenn man ausserhalb des Menüs klickt, ist die Formatierung des aktiven Menü-Links weg :-(

    Ohne jetzt einen fertigen Source vorweisen zu können, solltest du folgenden
    Ansatz mal verfolgen:
    Jeder Link bekommt eine ID.  <a id="link01" href="...>
    den link erledigst du per href und benutzt den eventhandler onClick, um eine JS-
    funktion aufzurufen, dieser übergibst du die ID des links. onclick="farbe('link01')"
    wichtig ist, dass du eine globale variable definierst, die den aktuell gültigen
    link behält!
    // nur initialisieren
    var aktuell = "link01";
    function farbe(id) {
          // aktuellen noch gültigen link zurückfärben!
        document.getElementById(aktuell).style.fontColor="#999999";
          // übergebenen link einfärben
        document.getElementById(id).style.fontColor="#336699";
          // übergebenen link zum aktuellen machen
        aktuell = id;
    }

    so, prädikat besonders ungetestet. ist blos ne idee.

    bye eddie

  2. hallo,

    <a href=# onmouseover="this.style.color='blue'" onmouseout="this.style.color='black'" onclick="window.location.href='neueUrl.html';this.style.color='gold';" onmouseup="this.style.color='black'">ein Test</a>

    das kann auch mal probiert werden: onfocus=this.backgroundColor='red';this.border='none';" onblur="this.backgroundColor='wheat';"

    für non-Standard-Browser, e.g. NN4, wäre dann
    this.fgcolor ,this. bgColor richtig, funktioniert aber nicht immer zuverlässig und ggf. dann nur mit einem Layer.
    <ILAYER onmouseover="this.document.alinkColor='blue'" ><A onmouseover="this.fgcolor='blue'" ></A></ILAYER>
    <NOLAYER>
    linkColor (Standard) ,vlinkColor (besucht) sind auch möglich

    <a href=# onmouseover="this.style.color='blue'" onmouseout="this.style.color='black'" onclick="window.location.href='neueUrl.html';this.style.color='gold';" onmouseup="this.style.color='black'">ein Test</a>
    </NOLAYER>

    Ganz schön aufwendig für einen Link, oder ?

    na, dann viel Spass

    Michael