Alexander: Textfarbe bei Mouse-Over-Event

SELF-Forum

Textfarbe bei Mouse-Over-Event

Alexander
– Informationen zu den Bewertungsregeln

Hallo Leute,

ich schlage mich seit kurzem mit JavaScript herum und komme bei folgendem Problem nicht weiter.
Auf einer Testpage habe ich einen Navigationsframe, der aus einer Tabelle besteht. In den einzelnen Spalten steht ein Text mit Hyperlink (Bsp. Home, News,..). Nun möchte ich durch den MouseOver, bzw. MouseOut-Event die Farbe des Textes ändern. Leider ist mir dies bisher noch nicht gelungen und dies habe ich auch nicht in Self-Html gefunden. Als provisorische Lösung verwende ich momentan anstelle des Textes kleine Grafiken. Darauf möchte ich aber, sofern es überhaupt geht, verzichten.
Wenn ich das Objektmodell richtig verstanden habe, werden die meißten Objekte in einzelnen Arrays abgelegt.
Werden auch die Texte in einem Array abgelegt ?
Wie kann ich die Farbe der Texte ändern ?
Für Eure Tips danke ich Euch bereits im voraus.

cu, alex

Beitrag melden
–
Informationen zu den Bewertungsregeln

  1. Textfarbe bei Mouse-Over-Event

    ottmar biebersdorf
    – Informationen zu den Bewertungsregeln

    Auf einer Testpage habe ich einen Navigationsframe, der aus einer Tabelle besteht. In den einzelnen Spalten steht ein Text mit Hyperlink (Bsp. Home, News,..). Nun möchte ich durch den MouseOver, bzw. MouseOut-Event die Farbe des Textes ändern. Leider ist mir dies bisher noch nicht gelungen und dies habe ich auch nicht in Self-Html gefunden. Als provisorische Lösung verwende ich momentan anstelle des Textes kleine Grafiken. Darauf möchte ich aber, sofern es überhaupt geht, verzichten.
    cu, alex

    hallo Alex,
    den code unten habe ich dem dhtml-cross-browser-api von Dan Steinman entnommen  (http://www.dansteinman.com/dynduo/). Eine ausführliche Erklärung findest Du dort auch. Habe damit auch mal angefangen, wurde mir aber zu kompliziert (netscape hat mir arge kopfschmerzen dabei bereitet).
    bis denn, ottmar

    <html>
    <head>
    <title>The Dynamic Duo - Changing Styles [Text Rollovers 2]</TITLE>
    <SCRIPT LANGUAGE="JavaScript">
    <!--

    ns4 = (document.layers)? true:false
    ie4 = (document.all)? true:false

    function layerWrite(id,nestref,text) {
            if (ns4) {
                    if (nestref) var lyr = eval('document.'+nestref+'.document.'+id+'.document')
                    else var lyr = document.layers[id].document
                    lyr.open()
                    lyr.write(text)
                    lyr.close()
            }
            else if (ie4) document.all[id].innerHTML = text
    }

    link = new Array()
    link[0] = new Array('link0Div','link1.html','Link 1',false)
    link[1] = new Array('link1Div','link2.html','Link 2',false)
    link[2] = new Array('link2Div','link3.html','Link 3',false)
    link[3] = new Array('link3Div','link4.html','Link 4',false)

    function linkOver(num) {
            if (ns4) {
                    for (var i=0;i<link.length;i++) {
                            if (link[i][3]==true) linkOut(i)
                    }
            }
            link[num][3] = true
            layerWrite(link[num][0],null,'<A CLASS="red" HREF="'+link[num][1]+'" onMouseOut="linkOut('+num+')">'+link[num][2]+'</A>')
    }

    function linkOut(num) {
            link[num][3] = true
            layerWrite(link[num][0],null,'<A CLASS="blue" HREF="'+link[num][1]+'" onMouseOver="linkOver('+num+')">'+link[num][2]+'</A>')
    }

    //-->
    </SCRIPT>
    <STYLE TYPE="text/css">
    <!--
    A.blue {color:blue;}
    A.red {color:red;}
    #link0Div {position:absolute; left:50; top:50;}
    #link1Div {position:absolute; left:50; top:70;}
    #link2Div {position:absolute; left:50; top:90;}
    #link3Div {position:absolute; left:50; top:110;}
    -->
    </STYLE>
    </HEAD>

    <BODY BGCOLOR="#FFFFFF">

    <DIV ID="link0Div"><A CLASS="blue" HREF="page1.html" onMouseOver="linkOver(0)">Link 1</A></DIV>
    <DIV ID="link1Div"><A CLASS="blue" HREF="page2.html" onMouseOver="linkOver(1)">Link 2</A></DIV>
    <DIV ID="link2Div"><A CLASS="blue" HREF="page3.html" onMouseOver="linkOver(2)">Link 3</A></DIV>
    <DIV ID="link3Div"><A CLASS="blue" HREF="page4.html" onMouseOver="linkOver(3)">Link 4</A></DIV>

    </BODY>
    </HTML>

    Beitrag melden
    –
    Informationen zu den Bewertungsregeln

    1. Textfarbe bei Mouse-Over-Event

      Alexander Schmitz
      – Informationen zu den Bewertungsregeln

      Hallo Ottmar,

      danke für die prompte Antwort !
      Ich werde mich mal damit Beschäftigen.
      Wenn ich weitergekommen bin, werde ich
      mich bei Dir melden.

      cu, alex

      Beitrag melden
      –
      Informationen zu den Bewertungsregeln