JürgenB: Zeitgesteuerte Anzeige

Beitrag lesen

Hallo karlheinz,

so schwer ist das garnicht.

Im Head benötigst du einen Scriptbereich, in dem die Funktion steckst, die alles macht:

<script type="text/javascript">  
function start() {  
 document.getElementById("Kap1").style.display="none";  
 document.getElementById("Kap2").style.display="none";  
 window.setTimeout('document.getElementById("Kap1").style.display=""',1000);  
 window.setTimeout('document.getElementById("Kap2").style.display=""',2000);  
}  
</script>

Mit document.getElementById("Kap1") erhälst du eine Referenz auf ein Element mit der ID "Kap1". Mit .style.display= änderst du die Display-Eigenschaft. window.setTimeout ruft eine Funktion, hier das Ändern der Display-Eigenschaft, nach einer Zeit in Millisekunden auf, im Beispiel nach 1 bzw. 2 Sekunden. Bei wenigen Elementen, die eingeblendet werden sollen, kann man das so machen. Eine for-Schleife wäre hier natürlich eleganter und kürzer. Dazu musst du wissen, das der "+"-Operator nicht nur Zahlen addiert, sondern auch Texte zusammenhängt: sei i=1, dann ergibt "Kap"+i den String "Kap1".

Im body-Tag muss jetzt die Funktion nach dem Laden der Seite aufgerufen werden, dieses geschieht mit dem Eventhandler onload:

<body onload="start()">

Jetzt fehlen nur noch die Elemente, die eingeblendet werden sollen:

<p id="Kap1">Text</p>  
<p id="Kap2">Noch mehr Text</p>

Die können an beliebiger Stelle (solange nach HTML-Regeln erlaubt) stehen. Statt <p> kannst du auch DIVs, LIs, TRs, etc. nehmen.

Du könntest jetzt meine Vorschläge einfach per copy and paste in deine Seite kopieren, besser ist es aber, wenn du, z.B. im http://de.selfhtml.org/javascript/index.htm die entsprechenden Kapitel liest. Wenn du etwas nicht verstanden hast, frag einfach nach.

Viel Erfolg,

Jürgen

PS
Und wenn alles funktioniert, solltest am Anfang der Funktion start() noch prüfen, ob der Browser des Besuchers überhaupt die Methode document.getElementById beherrscht und wenn nicht, die Funktion beenden. Bei älteren Browsern ist dies der Fall.

if(!document.getElementById) return;