GermanysNextTopfmodel: underline color per JS anpassen

Nabend zusammen,
gibt es eine Möglichkeit, per JS, die Farbe des Unterstrich zu ändern?
Die CSS Version mit dem Border-Button geht leider nicht, da ich das link-Element auf display-block gesetzt habe, und er(der jeweilige Browser) mir somit die Linie komplett unter das ganze Element setzen würde.
Da es nur als optisches Highlight dienen soll, wäre es nicht schlimm wenn es bei Leuten ohne aktiviertem JS nicht klappen würde.

dankbar für alle Ratschläge
Greetz
GermanysNextTopfmodel

  1. Liebes GermanysNextTopfmodel,

    die Farbe des Unterstrichs bei unterstrichenem Text ist immer identisch mit der eigentlichen Textfarbe. Das kannst Du nicht getrennt steuern.

    Außerdem (auf die Schnelle gefunden): </archiv/2005/3/t103121/>

    Liebe Grüße,

    Felix Riesterer.

    --
    ie:% br:> fl:| va:) ls:[ fo:) rl:° n4:? de:> ss:| ch:? js:) mo:} zu:)
  2. [latex]Mae  govannen![/latex]

    Nabend zusammen,
    gibt es eine Möglichkeit, per JS, die Farbe des Unterstrich zu ändern?
    Die CSS Version mit dem Border-Button geht leider nicht, da ich das link-Element auf display-block gesetzt habe, und er(der jeweilige Browser) mir somit die Linie komplett unter das ganze Element setzen würde.
    Da es nur als optisches Highlight dienen soll, wäre es nicht schlimm wenn es bei Leuten ohne aktiviertem JS nicht klappen würde.

    Möglich ist es. Du müsstest den Linktext mit JS auslesen, aus dem DOM-Baum entfernen, und diesen Text in ein span-Element (ggf. mit Klasse) gepackt wieder in den DOM-Baum schreiben. Dann kannst du die beiden unterschiedlich per CSS auszeichnen. Oder das Span-Element direkt im Quelltext setzen.

    vorher:
    <a href="http://example.com/bla.html">Mein Linktext</a>
    nachher:
    <a href="http://example.com/bla.html"><span>Mein Linktext</span></a>

    dann kannst du mit

    a {color: green}
    a span {color: red}

    einen roten Text mit grünem Unterstrich erzeugen.

    In JS kannst du die Links (document.links bzw. document.getElementsByTagName("a") [Achtung! erfasst auch Anker, also bei der Verarbeitungsschleife auf Vorhandensein von href testen]) dann mit den DOM Node Eigenschaften und Methoden oder innerHTML auslesen und zurückschreiben. Achtung: die beim zweiten Verweis ebenfalls aufgeführten innerText und outerHTML, die sich der Logik gemäß anbieten würden sind nicht browserübergreifend, innerHTML ist zwar auch nicht standardisiert, aber soweit ich weiß allgemein unterstützt.

    Cü,

    Kai

    --
    „It's 106 miles to Chicago, we got a full tank of gas, half a pack of cigarettes, it's dark, and we're wearing sunglasses“.
    „Hit it!“
    Selfzeugs
    SelfCode: sh:( fo:| ch:? rl:( br:< n4:( ie:{ mo:| va:) js:| de:> zu:) fl:( ss:| ls:?