Navigation mit Bildern

*räusper* Hallo!

Kann mir jemand helfen und mir erklären, wie ich die Navigationspunkte durch Bilder ersetzen kann, mitsamt MouseOver-/Hoover-Bildaustausch und dem ganzen Schnickschnack. Mit Hilfe von JavaScript müsste das doch möglich sein.

Oder gibt es da zufällig schon ein PlugIn für?
Würde sich ja geradezu anbieten..

Besten Dank!

h.

hm, das wären dann ja nur hintergrundbilder.
ich möchte ja andere schriftzüge benutzen, als die automatisch generierten.
dafür müsste ich für jeden menüeintrag ein eigenes bild mit eigenem hoover/active-austauschbild erzeugen und sicher über javascript austauschen lassen.
aber wie!?

mir ist schon klar, was der code bewirkt. und das ist nicht das, was ich benötige.

ich möchte z.B. den menüpunkt "home" durch das bild
Der Inhalt kann nicht angezeigt werden, da er nicht mehr verfügbar ist.

ersetzen.
das kann der css-code nicht bewirken.

und ich möchte jeden menüpunkt durch sein eigenes bild ersetzen, das dann auch sien eigenes hoover/active hat...

o.k., das kann auch sein. :-)

aber wie weiß der CSS-code denn, welches bild für welchen menüpunkt benutzt werden soll?

der code

a {background: url(images/bild1.png) no-repeat top left;}
a:hover {background: url(images/bild2.png) no-repeat top left;}

bewirkt ja eigentlich nur, dass das bild "images/bild1.png" für alle verlinkten inhalte als hintergrundbild genommen werden soll, oder verstehe ich da etwas falsch?

na ich probers einfach mal aus und lass mich überraschen...

wie ich es erwartet hatte wird im menü und bei allen anderen links auch ein hintergrundbild eingefügt.
die menüpunktbezeichnungen "news", "gallery" usw. bleiben erhalten, der text liegt jetzt nur über einem bild.
aber das ist nicht, was ich brauche.

tja, schade.
und trotzdem danke für den hilfeversuch - auch wenn meine anfrage anscheinend falsch verstanden wurde.

ich werde es dann also hard rein coden:

<div id="sidebar">


<div id="menu">
        <ul>
        <li><a href="./"><img src="<?php bloginfo('template_directory'); ?>/pics/menu_news.jpg" alt="" /></a></li>
        <li><a href="./?page_id=14"><img src="<?php bloginfo('template_directory'); ?>/pics/menu_artists.jpg" alt="" /></a></li>
        <li><a href="./?page_id=14"><img src="<?php bloginfo('template_directory'); ?>/pics/menu_dates.jpg" alt=""/></a></li>
        <li><a href="./?page_id=6"><img src="<?php bloginfo('template_directory'); ?>/pics/menu_diary.jpg" alt="" /></a></li>
        <li><a href="./?page_id=7"><img src="<?php bloginfo('template_directory'); ?>/pics/menu_gallery.jpg" alt="" /></a></li>
        <li><a href="./?page_id=7"><img src="<?php bloginfo('template_directory'); ?>/pics/menu_products.jpg" alt="" /></a></li>
        <li><a href="./?page_id=7"><img src="<?php bloginfo('template_directory'); ?>/pics/menu_contact.jpg" alt="" /></a></li>
        </ul>
</div>
</div>