html-Navigation mit auftauchendem Bild

  • Hallo!

    Ich möchte eine Navigation machen mit normalen HTML-Textlinks. Aber als Besonderheit hätte ich gerne bei Mouseover ein kleines Bild, das UNTER dem Textlink erscheint (so wie man mit HTML die Farbe des Textlinks bei Mousover verändern kann). Wie realisiere ich so etwas? Oder weiß jemand schon eine fertige Navigation, die diese Idee realisiert?.

    Danke!

    archaja

  • Hallo!
    Bin noch nicht wirlich weiter. Was verstehst Du unter "url_des_hoverbildes"? Ich habe den Bildnamen eingegeben und es auch mit einem Grafiklink versucht. Tat beides nicht.
    Es ergibt sich auch die Frage, wo sich das Bild positioniert (es sind ja keine "Ortsangaben" vorhanden.
    Danke. P.S. Habe Deine Seite besucht, sieht schick aus. Aber Du bist Deiner Zeit ganz schön voraus, wenn Du Dich seit dem 24.12.2006 mit Webdesign beschäftigst!archaja,

  • Hi

    Du hast geschrieben, du willst das Bild UNTER dem Text haben,

    UNTEN im Sinn von: vorne -- hinten
    oder
    UNTEN im Sinn von: oben -- unten

    ??

    hier ist ein Link im Sinne von oben -- unten:

    http://www.css4you.de/trickkiste/tr00022.html


    und hier ein Link im Sinne von vorne -- hinten:

    http://www.css4you.de/trickkiste/tr00023.html
    (anstatt der Hintergrundfarbe nimmst du einfach dein HintergrundBILD!)


    Ich hoffe, ich konnte dir helfen!! :)

    Gruss

    K.C.

  • Hallo!

    oben-unten. Das möchte ich gerne. Von dem her ist der erste Link genau richtig. Aber es funzt nicht. Ich habe mir das jetzt in Opera und in Firefox angeschaut, aber der Text: "Hier steht mehr zu den Hyperlinks" ist immer sichtbar. Ich habe dann mal meinen Link rein und das Bild das ich möchte:

    <title>Links mit zusätzlichen Informationen</title>
    <style type="text/css">
    p,div .info{
    <html><head>
    <title>Links mit zusätzlichen Informationen</title>
    <style type="text/css">
    p,div .info{
    font-family:Verdana;
    font-size:12px;
    color:#000000;
    font-weight:normal;
    }
    div a {
    display:block;
    float:left;
    margin-right:15px;
    width:100px;
    text-align:center;
    }

    a .info{visibility:hidden;}

    a:hover .info{visibility:visible;}
    </style>

    </head><body>

    <div>
    <a href="start.html">Hyperlink 1
    <span class="info">


    </span></a>


    <a href="#">Hyperlink 2
    <span class="info">


    Hier steht mehr zu Hyperlink 2</span></a></p>
    <a href="#">Hyperlink 3
    <span class="info">


    Hier steht mehr zu Hyperlink 3</span></a>
    <a href="#">Hyperlink 4
    <span class="info">


    Hier steht mehr zu Hyperlink 4</span></a>
    </div>

    </body>
    </html>

    Aber es geht nicht. Dabei ist es genau das, was ich will.

    Gruss Archaja

  • Hallo!

    Nehme alles zurück. Habe einen Kopierfehler gemacht, wie man oben sehen kann. Blöde Hektik!
    Es funktioniert! Vielen Dank, war genau das, was ich wollte.

    archaja