Popups


Habe gerade bei Engelbert von seiner JavaScript-Frage gelesen. Da in 18 Kommentaren nicht eine wirklich brauchbare Antwort vorhanden war, wollte ich es ihm eigentlich schnell in seinen Kommentaren erklären. Allerdings könnte das a) noch für andere Leser interessant sein und b) kann ich, wenn ich das hier als Beitrag veröffentliche, auch schnell wieder darauf zugreifen, wenn jemand wieder eine ähnliche Frage hat.
Also, Engelbertchen, los geht’s.

(Alles fett geschriebene musst du durch deine Angaben ersetzen.)

Du musst in deine Templates irgendwo im Bereich zwischen <head> und </head> folgendes einbauen:

<script language=“JavaScript“ type=“text/javascript“>
function popup(url,fenster,features) {
window.open(url,fenster,features);
}
</script>

Damit hast du den Grundcode für JavaScript-Popups.

Wenn du dann ein Bild im Popup aufgehen lassen willst, solltest du praktischerweise erst einmal eine HTML-Datei anlegen, damit das alles besser aussieht.

Hier eine Vorlage:
<html>
<head>
<title>Titel des Bildes</title>
</head>
<body style=“margin:0;padding:0″>
<a href=“javascript:window.close()“><img src=“xxx.jpg“ border=“0″ alt=“Alt-Text“ title=“Titel-Text“ height=“100“ width=“100“ /></a>
</body>
</html>

Jetzt kannst du diese HTML-Seite in einem Popup aufrufen:

<a href=“xxx.html“ onclick=“popup(‚xxx.html‚,‘yyy‚,’width=100,height=100‚);return false“ target=“_blank“>Link-Text oder Vorschaubild</a>

Zur Erklärung:
xxx.html = Bild-URL (wenn in einem anderen Verzeichnis, dann mit Pfadangabe natürlich); die URL musst du zweimal eingeben (erkläre ich gleich, warum)
yyy = irgendein meist bedeutungsloser Name für das Popup (dient dazu, das Fenster via JavaScript wieder ansprechen zu können, kannst du aber auch leer lassen, also schreiben)
width=100,height=100 sind die Größenangaben für das Popup (sollte genauso groß sein wie das Bild oder ein bisschen größer)

Der zweifache Aufruf von xxx.html lässt Benutzer, die JavaScript deaktiviert haben, das Bild wenigstens in einem neuen Fenster sehen, wenn schon nicht in einem Popup.

So, jetzt gehen deine Bilder in einem schönen Popup auf, welches sich mit einem Klick auf das Bild wieder schließen lässt.