Beim Hover eines Links ein bestimmtes Bild wechseln

Hi Leute..
Ich habe mal wieder ein Problem..
Und zwar folgendes: Ich habe eine Navigation mit Links. Wie kann ich jetzt machen, dass beim "ueberfahren" eines Links immer ein zu dem Link gehoeriges Bild (oben auf der Seite) angezeigt wird?

Also noch mal verstaendlicher:
Ich habe folgende Seite: Link
Da ist ja links die Navi. Wenn ich jetzt zum Beispiel mit der Maus in der Zeile LMG bin, will ich, dass oben, in der obersten Spalte der Seite, das Bild lmg.png geoeffnet wird. Ist die Maus aber ueber Schueler, will ich, dass oben das Bild schueler.png sehen...

Weiss jemand wie ich das machen koennte?
Bedingung: Kein JavaScript... Allerdings wuerde PHP gehen... Und CSS natuerlich...

Ich habe mir gedacht, das es ja so aehnlich wie das ist, nur das ich den betreffenden Bereich ja nicht innerhalb des <a>...</a> Blocks schreiben kann, weil das Bild ja oben hin soll... Und absolut positionieren kann ich es ja auch nicht, weil ich die gesamte Tabelle ja horizontal und vertikal zentriere...

Wer weiss Rat?
MfG Aoeke

flenders

http://www.meyerweb.com/eric/css/edge/popups/demo2.html

Als Anmerkung: bei position:absolute; bezieht sich die Angabe doch auf das Eltern-Element - sollte deswegen doch eigentlich kein Problem sein

Aber das funktioniert auch nur, wenn das Elternelement absolut positioniert ist...
So habe ich es jedenfalls nur hinbekommen...
?????
Aber danke auf jeden Fall schonmal!
MfG Aoeke

Aber vielleicht kann man das ja mit PHP ein wenig umgehen...
Gibt es eine Moeglichkeit mit PHP die Breite des Browserfensters (also wirklich
nur der Bereich, in dem die Seite angezeigt wird) zu ermitteln?
MfG Aoeke

flenders

Nein, denn PHP läuft auf dem Server - Zeig doch mal deine Versuche

MC_Breit

Hi!

Versuch es doch mal so in der art:

<?xml version=1.0 encoding="utf-8"?>
<html>
 <head>
  <title>Hover test</title>
 </head>
 <body>
  <img src="standart.png" id="hoverimg" />
  <a href="#" OnMouseOver="hoverimg.src('hover.png')" OnMouseOut="hoverimg.src('standart.png')">Test</a>
 </body>
</html>

Ich weiß jetzt gerade nicht ob src als obj oder var gehandhabt wird, aber wenns nicht geht verushcsmal mit hoverimg.src=

bye..

MC_Breit schrieb:

Versuch es doch mal so in der art:
[...]

Ja, so in der Art hatte ich es ja vorher gemacht... Nur das ich bei dem Bild
nicht "id" sondern "name" verwendet habe... Nur sollte man bedenken, dass
solche Sachen wie onmouseover, etc. JavaScript sind, was ich ja vermeiden
wollte...
Ich habe es jetzt ohne Zentrierung gemacht... Aber einfach die Tabelle links
am Rand ist auch dumm also habe ich es einfach ein wenig nach rechts und nach
unten verschoben... Muss ja nicht immer alles perfekt geordnet und mittig
sein..
Das Ergebnis kann man hier betrachten: http://aoeke.funpic.de/
Viel hat sich nicht veraendert aber naja....
Danke fuer eure Hilfe.
MfG Aoeke

Achso, eine Sache noch: Wer sich die Seite mal mit dem Internet Explorer
anschaut, der wird so einen merkwuerdigen Zwischenraum zwischen der Navi-
Tabelle und dem Frame bemerken..
Weiss jemand, woran das liegt? Ich konnte keinen Fehler entdecken, aber
irgendwas muss ja falsch sein... Oder es ist mal wieder nur der Browser des
Benutzers....
MfG Aoeke

MC_Breit

OMFG, das klappt wohl alles nciht so ganz wie du es willst
Also, sowohl im Mozilla 1.6 als auch IE6 und Opera7 geht bei mir nix richtig, ich denke zumindest das du das img ja ganz rüber haben wilst, und nicht nur irgendwo in der mitte hängen!?

Schau auch mal da vorbei: http://bobby.watchfire.com
Und da es sich hier nur um eine Designspielrei handelt, und um nix was die funktion ausmacht, kannst du beruhigt JS benutzen, und keine angst, Mozilla und Opera beherschen JS sogar besser als der IE