Wir möchten Ihnen verschieden Skripte vorstellen, die wir auch bei unseren Internetseiten verwendet haben. Für einige Texte ist es nützlich sie längere Zeit auf dem Bildschirm in einem eigenen Fenster geöffnet zu lassen, während man im eigentlichen Browserfenster weiterarbeitet. Bei einem PopUp Fenster kann nicht nur die Größe und die Position des Fensters bestimmt werden, sondern zusätzlich auch das Aussehen. Adresszeile, sowie die Scrollbalken etc. können weggelassen werden >> siehe Parameter.
Um ein Popup-Fenster realisieren zu können, müssen Sie mit JavaScript arbeiten, und zwar mit der Methode "window.open()." JavaScript macht vieles möglich. Leider sind Nebenwirkungen zu befürchten. Die Redaktion der c't warnt auf den Seiten zum Thema 
JavaScript: Die Mehrzahl der bekannten Sicherheitsprobleme mit Web-Browsern hingen eng mit JavaScript zusammen. Oft sei JavaScript das Hauptproblem. Oft biete es aber auch "nur" die nötigen Mittel, um die Sicherheitslücke eines anderen Softwareelements auszunutzen.
Deshalb sollte man sich immer die Fragen stellen, ob der Nutzen beispielsweise eines Popup-Fensters es rechtfertigt, die anfällige Technik zu nutzen. Außerdem werden diejenigen, die JavaScript wegen Sicherheitsbedenken abgeschaltet haben, das neue Fenster nicht sehen.
Ganz ohne JavaScript kommt die Technik "resizeTo" aus, mit der sichdie Fenstergröße eines Browserfensters anpassen lässt. Alle anderen Paramenter bleiben hier erhalten.
Um die Spannung zu steigern und die Wartezeit zu überbrücken können Sie einen Countdown einrichten, es gibt die verschiedensten Möglichkeiten.
Bald dürfen wir feiern, es sind nur noch
bis zum Jahreswechsel 2018
download als Zip Datei (1,7kb) 
PopUp Fenster werden mit Hilfe von JavaScript erstellt. Das folgende Skript wurde mit Internet Explorer, Netscape und Mozilla erfolgreich getestet.
Beim Einbinden ist zu beachten, dass keine Zeilenumbrüche zwischen var popup = window.open und height=400'); sind, diese Parameter müssen in einer Zeile stehen! Selbst durch fehlende Leerzeichen können Fehler auftreten. Jede Zeile endet mit einem Semikolon. weitere Informationen
<head>
<title>Das ist ein Test</title>
<script language="JavaScript">
<!--
function neuesfenster()
{
top.name = "main_window";
var popupURL = "paragraf.html";
var popup = window.open(popupURL,"neuesfenster",'toolbar=0,location=0,
directories=0,status=0,menubar=0,
scrollbars=1,resizable=0,left=400,width=500,height=400');
if( navigator.appName.substring(0,8) == "Netscape" )
{
popup.location = popupURL;
popup.opener = self;
}
}
// -->
</script>
</head>
Das Script wird durch anklicken eines Links ausgeführt. Hierfür muss im <body> noch folgende Zeilen eingefügt werden.
<a href="#" onClick="window.open('paragraf.html','NewWindow','toolbar=no,
location=no,directories=no,status=no,menubar=no,scrollbars=yes,resizable=no,
left=400,width=500,height=400')">
Klicken Sie hier, um ein Beispiel zu sehen. Es öffnet sich ein kleines Fenster.</a>
Klicken Sie hier, um ein Beispiel zu sehen. Es öffnet sich ein kleines Fenster.
| dependent |  |
Hier wird das "Elternfenster" zusammen mit dem PopUp Fenster geschlossen (yes) oder bleibt erhalten (no). |
| heigth | Höhe des Fensters - Angaben in Pixel | |
| left | Mit diesem Parameter kann der Abstand der linken Kante des Fensters zum Bildschirmrand bestimmt werden. Die Angaben erfolgen in Pixel. | |
| location | Das Fenster enthält eine eigene Adresszeile location=yes oder keine = no | |
| resizable | Das Fenster kann durch den Benutzer in der Größe verändert werden (yes/no) | |
| scrollbars | Scrollbalken (yes/no) | |
| status | Statusleiste (yes/no) | |
| toolbar | Das Fenster enthält eine Werkzeugleiste toolbar=yes oder keine=no | |
| top | Hiermit wird der Abstand zwischen Oberkante des Bildschirms und Fenster festgelegt. | |
| width | Breite des Fensters - Angaben in Pixel |
Soll nur die Fenstergröße verändert werden, geht das mit dem Skript "resizeTo". Die Zielgröße wird in Pixel angegeben. In unserem Beispiel 580 x 420 Pixel.
<html>
<head>
<title>Test</title>
</head>
<body onLoad="window.resizeTo(580,420)">
</body>
</html>
klicken Sie hier, um das Beispiel zu sehen.
Letzte Aktualisierung:
Freitag, 19.01.2018