Quelltext
<script language="JavaScript">
<!--
function texte() {
this[0]="Auf Los ...<p><font color=#ffffff>...geht's los</font>";
this[1]="Heute";
this[2]="<br>zeigen wir";
this[3]="<br><br>JavaScript";
this[4]="<br><br><br>für Alle!";
this[5]="dia1.htm";
this[6]="dia2.htm";
this[7]="dia3.htm";
this[8]="Game<p><font color=#000000>over</font>";
if(navigator.appName.substring(0,5) == "Micro") {
this.length=8;
} else {
this.length=9;
}
}
text=new texte();
win=null;
tim=null;
WAIT1=200;
WAIT2=1000;
WAIT3=3000;
function init() {
bref=window.location.href.toLowerCase();
bref=bref.substring(0, bref.indexOf("dia"));
win=window.open("", "dia_show", "width=300,height=300");
num=0;
col=15;
stop=false;
show();
}
function show() {
if(stop) {
win.close();
return;
}
if(win.focus != null)win.focus();
if(text[num].indexOf(".htm") > 0) {
win.location.href=bref+text[num];
wait=WAIT3;
} else {
win.document.open("text/html");
win.document.write("<base href=\""+bref+"\">");
if(num == 0) {
win.document.write("<body bgColor=#ffffff text=#000000>");
} else {
win.document.write("<body bgColor=#000000 text=#ffffff>");
}
win.document.write("<img src=\"rc_"+num+".gif\" width=15 height=20 hspace="+15*num+">");
win.document.write("<br><center><h1>");
win.document.write(text[num]);
win.document.write("</center></body>");
win.document.close();
wait=WAIT2;
}
num++;
if(num == 1) {
fade();
} else if(num < text.length) {
tim=setTimeout("show()", wait);
} else {
tim=setTimeout("fade()", WAIT1);
}
}
function fade() {
if(stop) {
win.close();
return;
}
if(num == 1) {
col--;
} else {
col++;
}
hex="0123456789abcdef".charAt(col);
hex=hex+hex+hex+hex+hex+hex;
win.document.bgColor=hex;
if(col > 0 && col < 15) {
tim=setTimeout("fade()", WAIT1);
} else {
if(num == 1) {
tim=setTimeout("show()", WAIT2);
} else {
tim=setTimeout("win.close()", WAIT3);
}
}
}
function exit() {
stop=true;
}
//-->
</script>
Erläuterung
Mit der Zeile "text=new texte()" wird ein eigenes Objekt definiert,
das als Eigenschaften die Texte bzw. URL's, die angezeigt werden sollen,
enthält. Das in der Funktion "texte" verwendete Schlüsselwort
"this" bezieht sich in diesem Zusammenhang auf das neu definierte Objekt.
Da es speziell beim MSIE 3.0 Darstellungsprobleme von "text[8]"
gibt, wird der verwendete Browser abgefragt und gegebenenfalls dieses
Element weggelassen.
Die Funktion "init" erzeugt ein kleines leeres Fenster und ruft ihrerseits
erstmalig die Funktion "show" auf.
In der Funktion "show" wird das "num"-te Element des Objekts "text"
dargestellt. Dabei muß unterschieden werden, ob es sich um eine
URL oder einen einfachen Text handelt. Zum Darstellen einer vorhandenen
Seite ist lediglich die Eigenschaft "location.href" des Fensters entsprechend
zu setzen. Zur Anzeige eines Textes wird der HTML-Code einer kompletten
Seite dynamisch generiert. Nach der Darstellung des jeweiligen Elements
wird "num" hochgezählt. Außerdem wird ein Timer gesetzt, der
wiederum "show" aufruft, um das nächste Element darzustellen.
Speziell bei der ersten und letzten Seite wird die Funktion "fade"
aufgerufen.
Die Funktion "fade" ändert dynamisch die Hintergrundfarbe des Fensters.
Dazu wird die Eigenschaft "bgColor" des Fensters geändert.
Mit der erst ab V 1.1 vorhandenen
Methode window.focus() stellt sich das kleine Fenster
in den Vordergrund.
Übung
Schreiben Sie eine Funktion, die in einem eigenen kleinen Fenster eine
Meldung ausgibt. Nach Betätigung eines "OK"-Knopfes soll das
Fenster wieder gelöscht werden.
Im Prinzip also das, was "window.alert()" tut, jedoch mit
der Möglichkeit eigener grafischer Gestaltung
[Lösung]
Referenz
[window.open]
[window.close]
[document.open]
[document.close]
[navigator]
window.open
Mit der window.open() Methode wird ein neues Browser-Fenster
geöffnet. Der Aufruf erfolgt in der Form:
win1=window.open(URL, name, [features]);
In der Variablen win1 wird ein Zeiger auf das neue Fenster abgelegt;
über diesen Zeiger kann dann später mit JavaScript auf das
Fenster zugegriffen werden. Als URL wird die Adresse der Seite
angegeben, die im Fenster dargestellt werden soll. URL kann wahlweise
auch eine leere Zeichenkette enthalten, dann bleibt das neue Fenster
zunächst leer. In name wird eine Zeichenkette angegeben,
mit der das neue Fenster benannt werden soll.
Der Name darf nur aus Buchstaben, Ziffern und dem "_" bestehen.
Wenn es ein Fenster gleichen
Namens schon gibt, so wird dieses in win1 zurückgegeben.
Der vergebene name kann in HTML-Tags wie z.B. "<a href=..."
mit "target=name" verwendet werden.
Im Parameter features können eine Reihe von Angaben zum
Aussehen des neuen Fensters gemacht werden: