Listen-Navigation mit Grafiken Einstellungen

[S.Buckel]

Hallo Zusammen!
Seit einiger Zeit versuche ich mich daran die Listen-Navigation mit Grafiken zu machen. Die Links als Grafik darstellen zu lassen bekomme ich ohne Probleme hin, dazu habe ich folgendes gemacht

QUELLTEXT

<li><a href="{link}">{name}</a>{ordner}</li>

in

QUELLTEXT

<li><a href="{link}"><img src="media/img/{name}.gif" /></a></li>

geändert. Dadurch bekomme ich die Grafiken sauber so angezeigt wie ich das möchte.

Nun wollte ich aber jedoch noch einen "hover"-Effekt einbauen. Also, beim drüber fahren mit der Maus sollte eine andere Grafik geladen werden. Dazu habe ich bei dem a-Tag folgendes hinzugefügt

QUELLTEXT

<li><a href="{link}" class="{name}"><img src="media/img/{name}.gif" /></a></li>

und eine entsprechende CSS-Regel dafür erstellt.

Leider ist das Ergebnis nicht so wie ich es mir wünsche...denn es passiert beim drüber fahren über die Grafik nichts.
Was mache ich falsch?


Grüße
S. Buckel

[Martin]

Versuchs mal so (nicht getestet):

QUELLTEXT

<li><a href="{link}" class="{name}"><img src="media/img/{name}.gif" onmouseover="this.src='media/img/{name}_over.gif';" onmouseout="this.src='media/img/{name}.gif';"/></a></li>

Gruß

M.

Der Beitrag wurde von Martin bearbeitet: Thu. 4. March 2010, 14:58

[pawel]

Du kannst doch auch die Bilder per CSS laden:

QUELLTEXT

<li class="{name}"><a href="{link}">{name}</a>{ordner}</li>

und vielleicht CSS-Sprites nutzen.

Wofür nutzt Du das Bild, d.h. was enthält es?