CSS basierte Mini Fotogalerie

Diese kleine Fotogalerie war eigentlich mehr ein Zufallsereignis. Als Vorlage diente [diese Beschreibung von Cornelia Lange] über ein CSS Linkpopup, mit welchem man zusätzliche Informationen zu einem Link anzeigen lassen kann.

Was mit Texten geht, sollte auch mit Bildern gehen : Voilà.

cssgallery.jpg

[Hier geht es zur Beispielseite]

Wer mag kann sich den Code dort runterziehen.

Diese Galerie ist es, die ich auch in meiner [neuen Webseitenvorlage] eingebaut habe.

Etwas lästig ist ein Bug im IE. Der will und muss neben a:hover noch andere Pseudoklassen haben und mit der Hintergrundfarbe gibt es bei bestimmten Einstellungen auch Pobleme. Wieder mal so ein Punkt, wo man doch etwas ärgerlich wird. Es dauert halt wegen der Eigensinnigkeit des IE alles immer ein bisschen länger. Aber nun gut – der Bug lässt sich umgehen.

Um beim erstmaligen Laden einer Seite gleich ein vergrößertes Bild betrachten zu können, wäre es möglich für das erste Bild im showcase eine gesonderte Klasse mit display:block anstatt display:none zu definieren. Man mag darüber streiten, ob Netscape noch berücksichtigt werden muss oder nicht – jedenfalls macht dieser Browser dann nicht mehr mit. Deshalb habe ich mich für eine zweite Variante entschieden und ein wenig gemogelt. Das erste Bild ist ein Hintergrundbild über welches sich alle anderen Bilder drüber legen.

Beim Experimentieren mit dieser kleinen Galerie zeigt sich, wie wendig sie ist und wie viele Möglichkeiten der Gestaltung darin stecken können.