Tips & Tricks: Die Alert-Box


Dieses einfache Beispiel zeigt, wie man eine Alert-Box beim Laden und Verlassen einer Seite automatisch aufrufen kann, um Informationen anzuzeigen. Außerdem lernen Sie einige Sonderzeichen zur Formatierung der Boxen kennen. Zunächst aber zu unseren Mitteilungs-Boxen. Hierbei benötigen wir zwei Funktionen, die einen Alert-Text ausgeben. Eine beim Laden der Seite und eine beim Verlassen der Seite. 


function hallo(){
alert("\n Danke das Sie meine Seiten besuchen.       " +
      "\n Ich hoffen Ihnen gefallen meine Tips.      " +
      "\n\n\ Beachten Sie bitte bsonder die Sektion News." +
      "\n Hier finden Sie Neuigkeiten aus der Netzwelt");
}


function bye(){
alert("\n Ich hoffe Sie besuchen meine Seiten bald wieder.");

}


Die Bedeutung der Sonderzeichen (z.B. \) werden Ihnen weiter unten in diesem Tip erklärt. Nun müssen wir nur noch die EventHandler onLoad und onUnload in das Body-Tag einbinden: 


<BODY BGCOLOR="#FFFFFF" onLoad="hallo()" onUnload="bye()">


Eine normale Alert-Box sieht leider etwas langweilig aus. Um diese wenigsten etwas anzupassen, stehen Ihnen etliche Sonderzeichen zur Verfügung:


Ein paar kleine Tips noch am Rande. Falls Sie die Alert-Box etwas breiter als der Text darstellen möchten, so müssen Sie einfach leerzeichen einfügen. Um die gewünschte Breite zu erreichen, muß man etwas probieren. 


alert("\n\n Kennen Sie die kleinen Smiley-Wesen?                ");


Damit Sie den kompletten Text nicht in eine fortlaufende Zeile tippen müssen, können Sie die Strings mit dem + Zeichen verknüpfen. Dies verschafft Ihnen einen besseren Überlick über den Inhalt und der Sonderzeichen. Nachfolgend das Listing des obigen Beispiels: 


alert("\n\n Kennen Sie die kleinen Smiley-Wesen?            " +
      "\n ------------------------------------------------------------" +
      "\n\n Wenn nicht, dann sehen Sie sich die" +
      "\n folgende Aufstellung etwas genauer an:" +
      "\n\n\n\t =|:-) \t Abe Lincoln" +
      "\n\n\t :´} \t Richard Nixon" +
      "\n\n\t :(=) \t Jimmy Carter" +
      "\n\n\t 7:^] \t Ronald Reagan" +
      "\n\n\t \\|=// \t George Bush" +
      "\n\n\t =:o] \t Bill Clinton" +
      "\n\n\n Wie Sie sehen, kann man eine Alert-Box" +
      "\n bedingt formatieren." +
      "\n\n Bis zum nächsten Tip, gez. HANNES  \n\n ");