Bildnavigation

css_bastian · #1 (**permalink**) 01.02.2006, 14:23

Hallöchen,
folgendes Problem taucht bei mir auf:

Ich habe eine navigation.php die in alle php dokumente includet wird.
In dieser befindet sich folgender Inhalt:

Code:

<div id="navbar">
[img]/images/nix.gif[/img]

[img]/images/nix.gif[/img]

[img]/images/navi_punkte.gif[/img]

[img]/images/nix.gif[/img]

[img]/images/nix.gif[/img]

[img]/images/navi_punkte.gif[/img]

[img]/images/nix.gif[/img]

[img]/images/nix.gif[/img]

[img]/images/navi_punkte.gif[/img]

[img]/images/nix.gif[/img]

[img]/images/nix.gif[/img]
</div>

Die css enthält:

Code:


a img {height: 21px; width: 115px; border-width: 0; background: top left no-repeat;}

a#ueber img {background-image: url(/images/navi_ueber_aus.gif);}
a#event img {background-image: url(/images/navi_event_aus.gif);}
a#engi img {background-image: url(/images/navi_engi_aus.gif);}
a#kontakt img {background-image: url(/images/navi_kontakt_aus.gif);}

a#ueber:visited img {background-image: url(/images/navi_ueber_aus.gif);}
a#event:visited img {background-image: url(/images/navi_event_aus.gif);}
a#engi:visited img {background-image: url(/images/navi_engi_aus.gif);}
a#kontakt:visited img {background-image: url(/images/navi_kontakt_aus.gif);}

a#ueber:hover img {background-image: url(/images/navi_ueber_aus.gif);}
a#event:hover img {background-image: url(/images/navi_event_aus.gif);}
a#engi:hover img {background-image: url(/images/navi_engi_aus.gif);}
a#kontakt:hover img {background-image: url(/images/navi_kontakt_aus.gif);}

a#ueber:active img {background-image: url(/images/navi_ueber_an.gif);}
a#event:active img {background-image: url(/images/navi_event_an.gif);}
a#engi:active img {background-image: url(/images/navi_engi_an.gif);}
a#kontakt:active img {background-image: url(/images/navi_kontakt_an.gif);}

Wenn ich in meinen Links <a id="ueber" href="#"> keinen Link reinsetze ( also z.b. # ) funktioniert alles Problemlos. Wenn ich auf den Link klicke setzt er ihn aktiv.

Sobald ich aber einen Link einsetze scheint er den status beim klicken zu verlieren..

Gibt es da eine elegante Lösung?

Danke
Bastian

mazzo · #2 (**permalink**) 01.02.2006, 14:34

wieso gibts Du einem <img> ein Background-Image mit? Wie soll das (ausser bei transparenten Bildern) dargestellt werden?

Schau mal in meine Sig, da gibts haufenweise Beispiele, wie man mit Hintergrundbildern des Ankers (in Listen) hover-Effekte erstellt.[/i]

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
Bildnavigation (ul) hat im IE6-8 unerwünschten Abstand	shorshe	CSS	5	02.02.2010 09:52
Bildnavigation über Menu	techniker	(X)HTML	0	11.03.2009 19:02