nina: Text-Link bei Mouseover verändern (Pfeile davor setzen)

liebes forum,

eine freundin braucht hilfe bei einem menü, sie möchte, dass bei mouseover auf ihre links pfeile davor erscheinen, bzw. das wort unterstrichen wird. das mit dem unterstreichen ist klar, das kann man mit a:hover lösen. aber wie ist das mit den pfeilen? geht das mit javascript, oder vielleicht doch eher dhtml?

ich (bzw. meine freundin) wäre euch für anregungen sehr dankbar.

liebe grüße, nina

  1. Hallo nina,

    eine freundin braucht hilfe bei einem menü, sie möchte, dass bei mouseover auf ihre links pfeile davor erscheinen,

    du weißt schon, dass da u.U. einiges das Springen anfängt?

    aber wie ist das mit den pfeilen? geht das mit javascript, oder vielleicht doch eher dhtml?

    am einfachsten wäre das mit css:

    a:hover:before { content:url(pfeil.gif); }

    allerdings funktioniert das nur mit Opera/Mozilla, für den IE müsste da sowas wie

    document.getElementById(id).firstChild.data = '-> '+document.getElementById(id).firstChild.data;

    her. Das ganze bei onmouseover aufrufen und für id die ID des Elements einsetzen - allerdings weiß ich nicht, wie man da Bilddateien einbauen kann und außerdem müsste man den Pfeil bei onmouseout wieder entfernen...

    Grüße aus Nürnberg
    Tobias

    --
    Selfcode: sh:( fo:) ch:? rl:( br:< n4:& ie:% mo:| va:) de:] zu:) fl:( ss:| ls:[ js:|
    1. hallo tobias,

      erstmal vielen dank für die antwort. ich wisste gar nicht, dass sowas auch mit css geht - wieder was gelernt. ich glaube sie will das ganze mit text lösen, da wohl keine grafiken eingebaut werden sollen. also so: >> link

      macht das die lösung einfacher?

      1. Hallo nina,

        ich glaube sie will das ganze mit text lösen, da wohl keine grafiken eingebaut werden sollen. also so: >> link
        macht das die lösung einfacher?

        wenn sie es mit css machen will, ist es von der Schwierigkeit her egal (einfach 'content:">> ";' verwenden), mit js ist es mit nur Text afaik leichter (beim Aufrufen der Funktion mit onmouseover den aktuellen Wert zwischenspeichern und beim Aufrufen mit onmouseout wieder einsetzen. Alternativ kannst du das '>> ' auch mit substring o.ä. wieder entfernen).

        Grüße aus Nürnberg
        Tobias

        --
        Selfcode: sh:( fo:) ch:? rl:( br:< n4:& ie:% mo:| va:) de:] zu:) fl:( ss:| ls:[ js:|
        1. hallo tobias,

          nochmal vielen dank für die ausführung, ich werde das sofort weiterleiten.

          liebe grüße, nina

  2. liebes forum,
    eine freundin braucht hilfe bei einem menü, sie möchte, dass bei mouseover auf ihre links pfeile davor erscheinen, bzw. das wort unterstrichen wird. das mit dem unterstreichen ist klar, das kann man mit a:hover lösen. aber wie ist das mit den pfeilen? geht das mit javascript, oder vielleicht doch eher dhtml?
    ich (bzw. meine freundin) wäre euch für anregungen sehr dankbar.
    liebe grüße, nina

    Hallo, ihr zwei scharfen Katzen !

    <html><head><title></title>
    <Style Type="text/css">
    <!--
    a:link { text-decoration: none; color: #000000}
    a:visited { text-decoration: none;  color: #000000}
    a:active { text-decoration: none; color: #000000}
    a:hover { text-decoration: underline; color: #FF0000}
    //-->
    </Style>
    <script language="javascript">
    function zeige(a)
    {window.document.getElementById(a).style.visibility="visible";}
    function verstecke(a)
    {window.document.getElementById(a).style.visibility="hidden";}
    </script>
    </head>
    <body>
    <img src="pfeil1.gif" style="visibility:hidden" id="bild1">
    <a href="Pfad_1.htm" onmouseover="zeige('bild1')" onmouseout="verstecke('bild1')">Link 1</a><br>
    <img src="pfeil2.gif" style="visibility:hidden" id="bild2">
    <a href="Pfad_1.htm" onmouseover="zeige('bild2')" onmouseout="verstecke('bild2')">Link 2</a><br>
    <img src="pfeil3.gif" style="visibility:hidden" id="bild3">
    <a href="Pfad_1.htm" onmouseover="zeige('bild3')" onmouseout="verstecke('bild3')">Link 3</a>
    <!--- usw ......>
    </body></html>

    Gruß und feuchten Kuss !
    ;o))))

    1. hallo 08/15,

      auch dir vielen dank für die hilfe, ich werde das gleich so weitergeben.

      liebe grüße, nina

      ps: mit katzen hattest du recht.