Rollover mit Bildaustausch mehrfach und verschieden

Hallo zusammen,
jetzt hab ich schon so viele Sachen gegoogelt, aber irgendwie kommt da immer die einfache Lösung zum Vorschein, mit dem CSS und Rollover.
Das einfache klappt ja auch, aber sobald 3 andere verschiedene Zustände dazukommen funzt es nicht mehr.
Ich habe ein "Navibild" worauf 4 verschiedene Links mit gebogener Schrift sind. "Home", "Login", usw.
Der normale Weg ist a:link { usw hab daraus dann

#home:link

<div id="home"></div>

 
<div id="apDiv4">
  <div id="navi">
  <div id="home"> <a href="index.php"></a> oder fehlt gar noch ein Javascript ?
  <div id="login">
  </div>
  </div>
  </div>
  </div>
 

Aber da wird nur ein div angezeigt der die Breite vom Navi div hat und das wars.(Und natürlich auch das Navi gif und apDiv4)
MÜSSEN denn die anderen Zustände wie "active" und "visited" dringends definiert werden ? Oder kann man die weglassen ? (Die waren allerdings immer vorhanden. Nur nicht identisch.)

 
#home:link {
 position: absolute;
 text-decoration: none;
 display:block;
 width: 30px;
 height: 45px;
 background-repeat: no-repeat;
 background-image: url(homed.gif);
 left: 16px;
 top: 20px;
}
 

Ich danke Euch für Eure Hilfe.

Grüße
Chriss

Evtl kann dir das helfen:
http://www.seoconsultants.com/css/menus/tutorial/

Is zwar nicht mit Grafiken gelöst, das Prinzip sollte aber das gleiche sein...

display: none; heißt das Zauberwort

Danke Dir für Deine Mühe,

aber ich glaube ich hab mich da nicht richtig ausgedrückt ?!
Das Prob fängt schon an, das die Positionierung (bei mehren) nicht klappt, der div wird einfach nicht so angezeigt wie er in der CSS steht und mal ganz abgesehen davon, das der Austausch erst gar nicht statt findet bzw. das Bild wird erst gar nicht angezeigt, durch den a href passiert auch nicht mal das man irgendwas anklicken könnte.

Hier mal die Navi Grafik wo die Schrift ausgetauscht werden soll, bzw eine andere Farbe bekommen soll.

[url]http://chriss136.spacequadrat.de/navikopie.gif[/url]

P.S. Ist das denn richtig mit

#home:link

stimmt das denn dann überhaupt das ich hier <div id="home"> schreibe ? Oder muß die ID anders von dem #home:link übergeben werden ? Normalerweise schreibt man doch [html]<a

würd die id an den link hängen und diesen dann dementsprechend formatieren...

kann mir grade nicht wirklich vorstellen wie du dir das vorgestellt hast mit dem menü...
soll das komplette menü-bild ausgetauscht werden, wenn man auf eine der divs geht ?

//edit: sind die divs denn schon korrekt positioniert ?
man könnte ja evtl auch einfach eine große navi-div machen und 4 kleine "link" div's...
die link div's hätten dann bei :hover den passenden viertel des bg-bildes in zb einer anderen farbe

also #home a { und #home a:hover { war das Zauberwort was geholfen hat Nun wird das Rollover über das eigentliche Bild gelegt,
funzt aber leider nur für einen a href, den ersten, bei den anderen wird nur die Maus angezeigt, das da wohl ein link sein müßte, aber kein Austausch

Vielleicht hilft mein link zu dem Navibild um klarer zu sehen, was ich meine ?!

Nen Link zu einer Online-Demo würd schon eher helfen...
Oder isses nen geheimprojekt ?

ne natürlich kein Geheimnis, nur dort funzt es genauso wenig wie das gif Bild

Momentan ist die Seite gar nicht mehr zu erreichen der Quelltext steht zwar, aber das bild ist komplett schwarz ?!
www.why-bottrop.de/de

weiß nich was da los war...
war bei mir auch erst so...
aber: die hover haben soweit funktioniert

naja, die oberen beiden... sind aber noch nicht richtig positioniert...

probier mal eben nen bisschen lokal aus... mal sehn ob ich was hinbekomm

lg

heee, jetzt funzt es freu. Woran lag das nun ? (Egal) Ist das immer so eine Positioniererei mit CSS ? Wird das auch passen, wenn einer ne andere Bildschirmauflösung hat ?!

Das mit der Auflösung ist bei CSS generell so ne Sache...
Müsst jetzt den genauer durchschaun, momentan siehts mir aber weniger kritisch aus...

Hast im Header fast nur mit Background-Bildern gearbeitet...
Das einzige Problem könnte entstehen, wenn ein User eine so kleine Auflösung hat, dass sich der Kompass mit dem Fluss überschneidet...

Kannst ja einfach mal ausprobieren

//edit: würd die divs noch ein wenig nach innen ausdehnen...
dann kann man rein theoretisch auch im inneren des kompas navigieren