Window-Script flexible Größe
Das Script 02 soll nun um eine zusätzliche Eigenschaft erweitert werden. Während bisher die Fenstergröße von vorne herein festgelegt war, möchten wir nun auch die Größe des Pop-Up-Windows erst beim Aufruf der JavaScript-Funktion bestimmem.
|
Hier wollen wir nun eine Pop-Up-Window-Funktion entwerfen, der wir erst beim Aufruf mitteilen, mit welchen Abmessungen das Window angezeigt werden soll. So schaffen wir eine erweiterte Flexibltät für den Einsatz unseres Pop-Up-Scripts. Die Entwicklung der neuen Funktion erkläre ich hier ausfühlich.
| |
Diese Parameter wollen wir dem fertigen Script übergeben:
| Dateiname |
dieURL |
Parameter für den Dateinamen |
| Fensterbreite in Pixel |
breite |
Parameter für die Breite des Fensters |
| Fensterhöhe in Pixel |
hoehe |
Parameter für die Höhe des Fensters |
|
Erweiterung des Window-Scripts 02
Während die Größe des Fensters bisher immer noch durch feste Angaben bestimmt wurde, setzen wir nun für Breite und Höhe zwei 'Platzhalter' ein. Wir ändern die Notierung aus dem Beispiel 2 die so aussah:
fenster1=window.open(dieURL,'infofenster','height=400,width=500');
in eine andere Notierung mit flexiblen Angaben für die Abmessungen des Windows
fenster1=window.open(dieURL,'infofenster',flexible Angaben hier);
Zwischenschritt zur Erklärung
Das Script für das Pop-Up-Window benötigt nun zur einwandfreien Funktion neben der Information für den Dateinamen zwei weitere Informationen für Breite und Höhe. Wir definieren diese Variablen außerhalb der eigentlichen Funktion
Die Anweisung zum Öffnen des Fensters könnte später so aussehen:
<script type="text/javascript" language="JavaScript">
<!--
var hoehe = "400";
var breite = "500";
function FensterGroesse(dieURL)
{
fenster1=window.open(dieURL,'Infofenster',Information zur Größe);
}
// -->
</script>
Da die Informationen zur Größe so notiert werden müssen ...
fenster1=window.open(dieURL,'Infofenster','height=400,width=500');
... fasse ich die gewünschten Information zur Größe aus den beiden Variablen 'breite' und 'hoehe' für die erforderliche Notation in einer neuen Variablen 'eigenschaften' zusammen
eigenschaften = "height=" + hoehe + ",width=" + breite";
Die Variable 'eigenschaften' hat dann diesen Inhalt:
eigenschaften = "height=300,width=500";
Das Script im Zwischenschritt:
<script type="text/javascript" language="JavaScript">
<!--
var hoehe = "400";
var breite = "500";
eigenschaften = "height=" + hoehe + ",width=" + breite;
function FensterGroesse(dieURL,eigenschaften)
{
fenster1=window.open(dieURL,'Infofenster',eigenschaften);
}
// -->
</script>
Würde man die Funktion FensterGroesse() nun aufrufen würde die Eigenschaften für Breite und Höhe den beiden Variablen 'breite' und 'hoehe' entnommen, in die neue Variable 'eigenschaften übertragen und der Funktion übergeben werden.
Damit haben wir nun die Angaben zur Größe nicht mehr fest innerhalb der Funktion verankert, sondern außerhalb der Funktion festgelegt. Jetzt gehen wir einen Schritt weiter übergeben der Funktion FensterGroesse() nun 3 Infos beim Aufruf:
- Informationen zum Dateinamen
- Informationen zur Fensterbreite
- Informationen zur Fensterhöhe
Das Script in der benötigten Version
Innerhalb der beiden Klammern hinter dem Namen der Funktion tragen wir nun die Namen der 3 Parameter für Dateiname, Breite und Höhe ein. Mit Hilfe dieser Parameter werden die im Aufruf beinhalteten Informationen übergeben.
<script type="text/javascript" language="JavaScript">
<!--
function FensterGroesse(dieURL,breite,hoehe)
{
eigenschaften = "height=" + hoehe + ",width=" + breite;
fenster1=window.open(dieURL,'Infofenster',eigenschaften);
}
// -->
</script>
|
Das Script steht nun im Kopf der HTML-Datei und kann bei Bedarf (auch mehrmals) aufgerufen werden. Beim Aufruf müssen wir nun allerdings drei Angaben mittels Platzhalter «übergeben». Das bedeutet, wir teilen der Funktion mit, was im Platzhalter 'dieURL', 'breite' und 'hoehe' steht.
| |
|