definieren 01
    


HOME
Quellcode ZURÜCK SITEMAP  

  Window definieren 01 - Fenstergröße und Datei

Schritt für Schritt. Fangen wir erst einmal ganz langsam an. Unser erstes JavaScript für ein Pop-Up-Window ist noch recht simpel und auch nicht besonders flexibel. Ich möchte sie ja auch nicht gleich mit 10 Fenstereigenschaften bombardieren.

Ein erstes simples Script soll ein PopUp-Window definieren. Bei diesem ersten Beispiel wird lediglich festgelegt, welche Datei im Window angezeigt werden soll und wie groß das Pop-Up-Window sein soll. Diese Angaben sind hier fest in die Anweisungen eingebettet. Das Script wurde also für ein einziges Fenster mit einem fest zugeordneten Inhalt geschrieben.

Im Head-Bereich einer HTML-Datei werden die dazu notwendigen JavaScript-Anweisungen zur Definition eines Windows abgelegt. Die Anweisungen stehen innerhalb der geschweiften Klammern eines Funktions-Bereichs.

<script type="text/javascript" language="JavaScript">
<!--

function Fenster()
{
fenster1=window.open('datei.htm','fenstername','Eigenschaften');
}

// -->
</script>
  • Ein neues Objekt wird definiert (fenster1)
  • Das Objekt ist ein Fenster (window)
  • Das Fenster soll gleich geöffnet werden (open)
  • im Fenster soll eine Datei angezeigt werden (datei.htm)
  • Das Window bekommt einen Namen (Fenstername)
  • Dahinter können die Eigenschaften für das Fenster stehen

Mehrere Eigenschaften werden durch ein Komma voneinander getrennt, z.B. :

      height=350,width=450

Weitere Eigenschaften können, müssen aber nicht eingetragen werden.

Übersicht der Eigenschaften



  simples Script-Beispiel

In diesem Beispiel ist von vorne herein festlegt, welche Datei im Fenster angezeigt werden soll und welche Eigenschaften (Größe) das Fenster haben soll.

Eigenschaften: Breite 350 Pixel und Höhe 450 Pixel
anzuzeigende Datei: datei.htm



  Script im Head

<script type="text/javascript" language="JavaScript">
<!--

function Fenster()
{
fenster1=window.open('datei.htm','infofenster','height=350,width=450');
}

// -->
</script>

So, das Script steht nun im Kopf der HTML-Datei zwischen <head> und </head> und kann bei Bedarf (auch mehrmals) aufgerufen werden. Allerdings wurde ja die anzuzeigende Datei festgelegt. Daraus folgt: Der angezeigte Inhalt des Fensters ist immer gleich.

Das Window würde also jedesmal die gleiche Datei als Inhalt zeigen. Wenn Sie das nicht möchten muss das Script geändert, der Aufbau dynamisch werden. Dazu mehr in einem anderen Beitrag.


Nun sollten sie noch bestimmen, bei welcher Aktion das Pop-Up-Window geöffnet werden soll. Dazu gibt es viele Möglichkeiten, z.B.:
  • bei einer Mausaktion (klicken)
  • beim Öffnen der HTML-Datei (auch zeitverzögert)
  • ausschließlich an einem bestimmten Datum
  • zu einer festgelegten Uhrzeit
  • ...



  Fenster öffnen mit einem Link

Beim Klicken auf den Link wird die im Head-Bereich definierte Funktion Fenster() aufgerufen.
<a href="javascript: Fenster()">Fenster öffnen</a>
 Fenster öffnen


  Fenster öffnen beim Laden der HTML-Datei

Damit das Script beim Laden einer Seite automatisch gestartet wird (mit OnLoad), tragen sie eine entsprechendes JavaScript-Anweisung in das <body>-Tag ein:
<body onload="Fenster()"; bgcolor="#FFFFFF" ... >







NACH OBEN