Definierbarer Countdown

Beim folgenden Script von TeSeven können verschiedene Texte angelegt werden, die nach Ablauf frei definierbarer Zeiten angezeigt werden.

In unserem Beispiel sind dafür 7 verschiedene Zeiten mit 7 verschiedenen Texten angelegt. Ihr könnt dabei auch eine andere Anzahl wählen, indem ihr die Elemente entsprechend setzt. Auch die Textfarbe und die Schriftart kann mit geändert werden.

Im Beispiel ändert sich der erste Text nach 10 Sekunden, der zweite nach 11 Sekunden usw.

<!-- präsentiert von kostenlose-javascripts.de --> <div id="text">Dieser Text wird vor Ablauf des ersten Countdowns angezeigt.</div><div id="zeit"></div> <script type='text/javascript'> <!-- var textfarbe = new Array(); var textgroesse = new Array(); var schriftart = new Array(); var i = new Array(); var text = new Array(); // WRITTEN BY TESEVEN | MEGACHELTERRAR || TESEVEN.WEEBLY.COM // written for slerrag (gutefrage.net) //---------------------------------------------------------------------------------------- i[1] = 10; //Hier die Zeit in Sekunden eingeben i[2] = 11; //Hier die Zeit für den zweiten Countdown in Sekunden eingeben i[3] = 12; //usw. i[4] = 15; i[5] = 15; i[6] = 15; i[7] = 15; //---------------------------------------------------------------------------------------- text[1] = "Dieser Text wird angezeigt."; //Hier den nachher anzuzeigenden Text eingeben text[2] = "Zweiter Text"; //Hier den zweiten Text eingeben text[3] = "<a href='http://google.de'>Dritter Text.</a>"; //usw. text[4] = "Vierter Text."; text[5] = "Fünfter Text."; text[6] = "Sechster Text."; text[7] = "Siebter Text."; //---------------------------------------------------------------------------------------- textfarbe[1] = "#000000"; //Hier die Textfarbe eingeben textfarbe[2] = "#0000FF"; //Hier die Textfarbe für den zweiten Text eingeben textfarbe[3] = "#00FF00"; //usw. textfarbe[4] = "#FF0000"; textfarbe[5] = "#FF0000"; textfarbe[6] = "#FF0000"; textfarbe[7] = "#FF0000"; //---------------------------------------------------------------------------------------- textgroesse[1] = "2.1"; //Textgröße eingeben (in em) textgroesse[2] = "2.0"; //Textgröße für den zweiten Text eingeben textgroesse[3] = "3.1"; //usw. textgroesse[4] = "5.1"; textgroesse[5] = "5.1"; textgroesse[6] = "5.1"; textgroesse[7] = "5.1"; //---------------------------------------------------------------------------------------- schriftart[1] = "Comic Sans MS"; //Hier die Schriftart eingeben schriftart[2] = "Arial"; //Hier die Schriftart für den 2. Text eingeben schriftart[3] = "Times New Roman"; //usw. schriftart[4] = "Arial Unicode MS"; schriftart[5] = "Arial Unicode MS"; schriftart[6] = "Arial Unicode MS"; schriftart[7] = "Arial Unicode MS"; //---------------------------------------------------------------------------------------- var anzahl = 7; //Hier die Anzahl der Countdowns angeben //---------------------------------------------------------------------------------------- var aktuell = 1; // WRITTEN BY TESEVEN | MEGACHELTERRAR || TESEVEN.WEEBLY.COM function fWechsel(){ if(i[aktuell]-1 < 1){ document.getElementById('text').innerHTML = "<span style='color:" + textfarbe[aktuell] + "; font-size:" + textgroesse[aktuell] + "em; font-family:" + schriftart[aktuell] + ";'>" + text[aktuell] + "</span>"; aktuell++; if(aktuell > anzahl){ document.getElementById('zeit').innerHTML = ""; }else{ document.getElementById('zeit').innerHTML = i[aktuell]; setTimeout("fWechsel()", 1000); } }else{ i[aktuell]--; if(i[aktuell] < 10){ document.getElementById('zeit').innerHTML = "0" + i[aktuell]; }else{ document.getElementById('zeit').innerHTML = i[aktuell]; } setTimeout("fWechsel()", 1000); } } //--> </script> <br /> JavaScript von <a href="http://www.kostenlose-javascripts.de/javascripts/texteffekte/definierbarer-countdown/" target="_blank">kostenlose-javascripts.de</a> <br /> <script type="text/javascript">fWechsel();</script> <!-- präsentiert von kostenlose-javascripts.de -->