Textfeld ausblenden

maria1986

Grünschnabel
Hallo ihr Lieben

ich habe folgenden Code im Internet gefunden. Er erzeugt einen Div-Container zur Erstellung eines Fensters, in dem ein Text dargestellt wird und erst nach 3 Sekunden erscheint. Da ich noch ein ziemlicher Newbee in Sachen Javascript bin, ist meine Frage, ob es möglich ist den Code so zu erweitern, dass das Fenster wieder nach 3 Sekunden verschwindet?
Schon mal vielen Dank für eure Hilfe…!



javascript:

<script language="javascript" type="text/javascript">
<!-- // JavaScript-Bereich für ältere Browser auskommentieren


function showFrame () {
// Div zur Darstellung eines Fensters erzeugen
df = document.createElement ('div');
// Überschrift-Element erzeugen
dh = document.createElement ('h1');
// Textknoten für die Überschrift erzeugen
dt = document.createTextNode ('Inhalt');
// in das h1-Tag...
dh.appendChild (dt);
// und dann in das div-Element einfügen
df.appendChild (dh);
// Textabsatz (p-Tag) für den Inhalt erzeugen
de = document.createElement ('p');
// Textknoten mit dem Inhalt des Absatzes erzeugen
inhalt = 'Hier steht etwas drin! '+
'Es handelt sich um einen etwas laengeren ' +
'Text, der keine besondere Bedeutung hat.';
dt = document.createTextNode (inhalt);
// und in das Div einfügen
de.appendChild (dt);
df.appendChild (de);

// Styles für den Div
df.style.position = 'absolute';
df.style.top = '6em';
df.style.left = '22em';
df.style.width = '11em';
df.style.border = '1px solid black';
df.style.padding = '10px';
df.style.backgroundColor = '#eee';
df.style.color = '#a00';

// Styles für die Überschrift
dh.style.margin = '0';
dh.style.fontSize = '1.3em';
dh.style.textDecoration = 'underline';
dh.style.backgroundColor = '#eda';

// Styles für den Textabsatz
de.style.color = '#00a';
de.style.margin = '0';
de.style.backgroundColor = '#ade';
de.style.textAlign = 'justify';

// Div samt Inhalt in das HTML-Dokument einfügen
document.getElementsByTagName ('body')[0].appendChild (df);


}


// Fenster nach Ablauf von 3 Sekunden anzeigen

window.setTimeout ('showFrame ()', 3 * 1000);



// -->
</script>
 
Setz bitte zukünftig [ javascript ] [ /javascript ] Tags (ohne die Leerzeichen) um deinen Code damit es einfacher zu lesen ist.

Zu deinem Problem:
Javascript:
// Nach dieser Zeile 
document.getElementsByTagName ('body')[0].appendChild (df);
// das hier einfügen 
window.setTimeout('document.getElementsByTagName (\'body\')[0].removeChild(df)',3000);
 
@rd4eva:
Du kannst in Zukunft auch die [plain ] [code=javascript] [/code] [ /plain] Tags benutzen. Dann sparst du dir das mit den Leerzeichen ;)
 
;) .... , noch mal eine andere Frage...

...jetzt wo es funktioniert, kann man die Funktion auch so erweitern, dass das Textfeld langsamer verschwindet oder zusammen klappt ...?
Es ist wahrscheinlich etwas umständlicher zurealisieren oder?
 

Neue Beiträge

Zurück