SSI - Bildergalerie ohne Arbeit
Bildergalerien finden sich auf den meisten privaten Websites. So
kann die liebe Verwandtschaft die Entwicklung der Kleinen verfolgen oder
die Freunde die gerade aktuelle Lebensgefährtin begutachten. Der Bau
einer solchen Galerie muss dank SSI kein großer Aufwand sein.
Thumbnails sind kleine Vorschaubilder. Auf Klick öffnet sich das Bild
in der normalen Größe, oft in einem neuen Fenster. Dies hat den Vorteil,
dass der Besucher nicht endlos warten muss, bis alle Bilder in höchster
Auflösung geladen sind - denn nicht alle Bilder interessieren ihn
wirklich.
Wenn die Seite im PopUp nicht nur aus dem eigentlichen Bild besteht,
sondern auch ein Hintergrundbild oder Buttons zum schließen hat, wird es
kompliziert: Für jedes Bild muss eine eigene Seite erstellt werden, wenn
nicht unser Javascript genommen wird.
Die Datei oeffner.html wird mit einem Javascript-PopUp geöffnet. Die
Adresse des Bildes wird mit einem Fragezeichen übergeben:
oeffner.html?baumschule.jpg lädt also das Bild baumschule.jpg. Unsere
Datei oeffner.html geht davon aus, dass dieses Bild im Ordner bilder/
vorliegt.
|
|
| Vorführeffekt: Der Bilderöffner in Aktion |
|
Die Datei oeffner.shtml sieht so aus:
<HTML>
<BODY BACKGROUND="bilder/hintergrund.gif"
onload="self.focus()">
<A HREF="#" onClick="window.close();return
false"><IMG
SRC="bilder/<!--#echo var="QUERY_STRING" -->"
BORDER=0></A>
</BODY></HTML>
Die onload-Funktion bringt das Fenster automatisch in den Vordergrund.
Bei Klick auf das Bild wird das Fenster auch automatisch geschlossen, dies
bewirkt der Zusatz onClick="window.close();return false" in dem
Link.
Die wichtige SSI-Zeile ist direkt in dem <IMG> tag: <!--#echo
var="QUERY_STRING" -->. Dadurch wird der Bildname, der per
Fragezeichen übergeben wurde, direkt in das <IMG> tag geschrieben.
|