Der folgende Beispiel-Code zeigt, wie ein PopUp-Fenster unmittelbar nach dem Laden eines HTML-Dokuments geöffnet werden kann. Dazu wird eine Funktion mit entsprechender Funktionalität als Event-Handler für das onLoad-Event eingesetzt. Dabei handelt es sich im unteren Beispiel um die Funktion popup_fenster, die bei Eintreten des Events mit den gewünschten Parametern aufgerufen wird. Weitere Informationen zur Verarbeitung von Benutzerereignissen finden Sie unter Event.
[php]
<html>
<head>
<title>PopUp Fenster mit JavaScript nach Laden der Seite öffnen</title>
<!– JavaScript-Code für das PopUp-Fenster –>
<script language="javascript" type="text/javascript">
<!– // JavaScript-Bereich für ältere Browser auskommentieren
var popup = null;
function popup_fenster (url, width, height) {
var parameter = (width ? ‚width=‘ + width : “) +
(height ? ‚,height=‘ + height : “) +
‚,resizable‘;
url = (url ? url : location.href);
if (popup instanceof Window && !popup.closed)
popup.window.location.href = url;
else
popup = window.open (url, “, parameter);
}
// –>
</script>
</head>
<!– onLoad-Event mit einer Event-Handler-Funktion belegen.
In diesem Fall ist dies die Funktion zum Öffnen des PopUps –>
<body onload="popup_fenster(‚http://….‘, 250, 150)">
Hier folgt der eigentliche Inhalt der Seite
…..
</body>
</html>
[/php]
Auch die zeitverzögerte Anzeige eines JavaScript-PopUps – nach Laden des HTML-Dokuments oder nach Eintreten eines anderen Benutzerereignisses – ist möglich. Die zeitliche Verzögerung kann mit Hilfe der Methode setTimeout realisiert werden. Ein solcher Aufruf wird im folgenden Script-Abschnitt realisiert, wobei das Foto nicht automatisch, sondern erst nach Anklicken des Links geöffnet wird.
Soll das Fenster automatisch nach Ablauf des Timeouts angezeigt werden, so muss lediglich der Teil innerhalb der Void-Klammer in einem JavaScript-Bereich notiert werden (s. a. JavaScript in HTML einbauen). Mit einer zweisekündigen Verzögerung wird ein PopUp-Fenster mit einem Foto geöffnet – Zum Thema Darstellung von Fotos auf Internetseiten beachten Sie bitte auch die JavaScript Galerie. Bei diesem Beispiel wird der Void-Operator verwendet um zu verhindern, dass der von setTimeout gelieferte Rückgabewert zum Überschreiben der aktuell angezeigten Seite führt.
[php]
<a href="javascript:void(window.setTimeout (‚popup_fenster (\’/bild.jpg\‘, 570, 380)‘, 2000))" title="">PopUp Fenster mit Verzögerung öffnen</a>
[/php]