Zeitgesteuerte Anzeige

[karlheinz]

Hallo Leute,

gibt es mit HTML oder Javascript die Möglichkeit, mehrere Textblöcke innerhalb einer Seite z. B. innerhalb einer Tabelle nacheinander anzeigen zu lassen, z. B. im Abstand von 2 sec. So ähnlich wie bei einer PowerPoint Präsentation?

Grüsse
Karlheinz

[Gernot Back]

Hallo karlheinz,

gibt es mit HTML oder Javascript die Möglichkeit, mehrere Textblöcke innerhalb einer Seite z. B. innerhalb einer Tabelle nacheinander anzeigen zu lassen, z. B. im Abstand von 2 sec. So ähnlich wie bei einer PowerPoint Präsentation?

Ich verstehe zwar nicht, wenn du so eine Spielerei innerhalb von wie einer Tabelle machen möchtest, die nüchterne tabellarische Daten enthält und wenn du es innerhalb einer Layouttabelle machen möchtest, verstehe ich es erst recht nicht, denn dadurch wird es unnötig kompliziert in der technischen Umsetzung. Eine Tabelle wird ja immer zappeln, wenn dynamisch unterschiedlich viel Text in ihre Zellen gefüllt wird.

Aber grundsätzlich gibt es die Möglichkeit ein Array mit diesen Textblöcken anzulegen und die Arrayelemente als innerHTML eines HTML-Elementes oder Data eines Textknotens in Intervallen oder Timeouts zeitgesteuert nacheinander auszutauschen.

Gruß Gernot

[karlheinz]

Hallo karlheinz,

gibt es mit HTML oder Javascript die Möglichkeit, mehrere Textblöcke innerhalb einer Seite z. B. innerhalb einer Tabelle nacheinander anzeigen zu lassen, z. B. im Abstand von 2 sec. So ähnlich wie bei einer PowerPoint Präsentation?

Ich verstehe zwar nicht, wenn du so eine Spielerei innerhalb von wie einer Tabelle machen möchtest, die nüchterne tabellarische Daten enthält und wenn du es innerhalb einer Layouttabelle machen möchtest, verstehe ich es erst recht nicht, denn dadurch wird es unnötig kompliziert in der technischen Umsetzung. Eine Tabelle wird ja immer zappeln, wenn dynamisch unterschiedlich viel Text in ihre Zellen gefüllt wird.

»»
Hallo,

so meine ich das
angenommen ich habe einen Text mittig, darunter sollen nacheinander 3 - vier Textblöcke nacheinander und nebeneinander eingeblendet werden. Ob das nun in einer Tabelle passier oder nicht, ist wurscht, hab ich oben auch geschrieben, ich dachte nur, dass es von der positioniererei vielleicht einfacher wird.

Karlheinz

[JürgenB]

Hallo Gernot, hallo karlheinz,

vieleicht wäre es einfacher (und für User ohne JS nutzbar), wenn alle Informationen auf der Seite stehen, egal, ob in Tabellenzeilen oder anderen Elementen (p, div, li, ...). Diese werden dann nach dem Laden (onload) unsichtbar gemacht (...display="none") und dann per setInterval nach und nach eingeblendet (...display="was_das_Element_benötigt", ich glaube, es geht auch ="" für den Defaultwert). Dazu muss karlheinz aber etwas Javascript lernen.

Gruß, Jürgen

[karlheinz]

Hallo Jürgen

Hallo Gernot, hallo karlheinz,

Dazu muss karlheinz aber etwas Javascript lernen.

Genau das ist hier das Prob. ;-)

Karlheinz

[JürgenB]

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;

[Karlheinz]

Hallo Jürgen,

ich glaube, das ist´s, ich probiers nachher gleich mal.

Danke
Karlheinz