Mouseover Effekt mit CSS

[Avalon]

Und zwar geht es um folgendes. WIr haben eine Seite mit ziemlich vielen Grafiken. (Ca. 2200) Jetzt wollen wir mit möglichst geringem Aufwand eine Mouseover-Funktion einbinden. D.h. wenn der Benutzer auf die Grafik   mit dem Zeiger kommt, dann soll sich ein PopUp öffnen, welches die Grafik nochmals größer anzeigt.
Natürlich kann man das für jede Grafik wieder neu in den Quellcode schreiben, das ist allerdings bei sovielen Grafiken kein tolles Unternehmen.

mit CSS wird es nicht gehen. Zumindest dann nicht wenn du nicht alle 2200 Grafiken (sind die alle in _einer_ Seite?) anpassen willst.

Natürlich geht es mit CSS, jedenfalls in neuen Browsern:

img:+div {diplay:none;}
img:hover+div {display:block; /* plus Positions- und Dimensionsangaben* /}

und:

<img src="kleinesBild" alt="kakadu" />
<div>
<img src="großesBild" alt="papagei" title="TextzumBild" />
</div>

MSIE Nutzer sollten sich dann aber eine Lupe besorgen. Aber: Webdesign darf nicht auf MS-Niveau eingefroren werden.

Gruß
Avalon