Countdown (Zähler) - Website X5 Hilfe - Die Helpsite

Logo Schriftzug
Logo WSX5
Newsletter anmelden
Scan QR or Download Android App
Direkt zum Seiteninhalt

Countdown (Zähler)

Scripte > Snipped

Weiterleitung zu einer anderen Webseiten

Möchte man einen gewissen Zeitpunkt attraktiv machen, kommt man an einen Countdown nicht vorbei.
Hier eine kleine Auswahl Analog, Digital und auf Flash.

Für die Datumsformate haben wir hier eine hilfreiche Liste für das JavaScript Date Object bereitgestellt.
Analoger Countdown
Dieser ist einfach gehalten und kann textlich angepasst werden. Einfach einen Tag nach dem Stichtag als Zieldatum eingeben und los geht die Zählung.
Die Textgröße und -farbe können entsprechend im HTML-Code der Homepage angepasst werden.
ZIP-Datei in ein beliebiges Verzeichnis auf dem PC entpacken. HTML-Code in den BODY-Bereich <body>...</body> der aufrufende Datei einfügen und Textbereiche sowie das Datum entsprechend anpassen. Fertig
Eine demo.html ist jeweils beigefügt, die zum Test in das Root-Verzeichnis des Webservers kopiert werden kann.
Aufruf: "http://www.domain.tld/demo.html". Diese kann aber auch durch einen Doppelklick ausgeführt werden.
Download Button
x runter geladen!
Code für den <BODY> Bereich
<div align="center"
id="Obj100_1" style="font-family: tahoma; font-size: 14px; color: #ff0000; font-weight: bold;">
</div>
<script>
var initi = window.setInterval ('downcount()', 1000);
var text = 'Einen Moment bitte, Du wirst ';
// Sekunden eintragen
var zahl = 180;
// Umleitungsseite eintragen
var dokument="wsx5sys06.php";
function downcount()
{
zeige = text + 'in ' +zahl+ ' Sekunden zu unserem Gästebuch weitergeleitet';
window.status = zeige ;
// für den Internet Explorer
document.all['Obj100_1'].innerHTML = zeige ;
// für die neuen Netscape Versionen
document.getElementById('Obj100_1').innerHTML = zeige ;
zahl --;
if (zahl < 0 )
{
location.href=dokument;
}
}
</script>
Noch * Stunden bis zum 24 Dezember 2025 / 16:30 Uhr.
Code für den <BODY> Bereich
<div align="center" style="font-size: 16px; font-weight: bold; color: #000;">
Noch <span id="stunden">*</span> Stunden
bis zum 24 Dezember 2025 / 16:30 Uhr.
<script>
// Countdown - Anzeige der verbleibenden Stunden
// Die Monatsnamen in englisch eintragen (Monatsname, Tag, Jahr, Uhrzeit)
var end = new Date('December 24, 2025 16:30:00');
var count = Math.floor(end.getTime() - new Date().getTime());
if (count > 0) {
document.getElementById('stunden').innerHTML = Math.floor(count/1000/60/60);
}
</script>
</div>
Noch Tage bis Weihnachten 2025
Code für den <BODY> Bereich
<div align="center" style="font-size:16px; font-weight:bold; color:#000;">
Noch
<script>
// Die Monatsnamen in englisch eintragen (Monatsname, Tag, Jahr, Uhrzeit)
var Ereignistag = new Date("December 24, 2025 00:00:00 GMT");
var d=new Date();
var zaehler=Math.floor((Ereignistag.getTime()-d.getTime())/1000);
zaehler=Math.floor(zaehler/(60*60*24));
document.write(zaehler);
</script>
Tage bis Weihnachten 2025
</div>
Noch Tage bis zum Jahr 2025.
Code für den <BODY> Bereich
<div align="center" style="font-size: 16px; font-weight: bold; color: #000;">
Noch
<script>
// Countdown
// Achtung: amerikanische Notation des Datums
var eventdate = new Date("January 1, 2025 00:00:00 GMT");
var d=new Date();
var count=Math.floor((eventdate.getTime()-d.getTime())/1000);
count=Math.floor(count/(60*60*24));
document.write(count);
</script>
Tage bis zum Jahr 2025.
</div>
Digitaler Countdown
Zur Ausführung dieses Skriptes wird neben dem HTML-Code selbst auch ein Javascript-Aufruf im Head-Bereich und ein Startcode innerhalb des Body-Tags benötigt. Form, Farbe und auch die Digits können der Homepage angepasst werden. Dazu haben wir im Hauptverzeichnis "wsX5Obj100_2" mehrere Digit_ Verzeichnisse bereits hinterlegt. Zur Änderung der Digits muss in der Javascript-Datei "digitime.js" und Html-Code das Verzeichnis entsprechend angepasst werden. Voreingestellt ist das Verzeichnis "digi_yellow".
ZIP-Datei in ein beliebiges Verzeichnis auf dem PC entpacken und das Verzeichnis "wsX5Obj" auf den Webserver in das Root-Verzeichnis kopieren.
Javascript-Code in den HEAD-Bereich <head>....</head>, START-Code in den Bodytag <body onload="..."> und HTML-Code in den BODY-Bereich <body>....</body> der aufrufende Datei einfügen.
Eine demo.html ist beigefügt, die zum Test in das Root-Verzeichnis des Webservers kopiert werden kann.
Aufruf: "http://www.domain.tld/demo.html". Diese kann aber auch durch einen Doppelklick ausgeführt werden.
Download Button
x runter geladen!
Noch   [Tage : Stunden : Minuten : Sekunden] bis zum neuem Jahr.
Code für den <HEAD> Bereich
<script type="text/javascript" src="wsX5Obj/Obj100_2/digitime.js"></script>
Code für den <BODY> Tag
onload="getTime(); window.setTimeout('getSecs()',1);"

Wer nicht mit Website X5 arbeitet:
<body onload="getTime(); window.setTimeout('getSecs()',1);">
Code für den <BODY> Bereich
<div align="center" style="font-size: 14px; font-weight: bold; color: #000;">
<table>
<tr>
<td>Noch &nbsp;</td>
<td bgcolor="black" valign="bottom" width="230" height="25">
<img height=21 src="wsX5Obj/Obj100_2/digi_yellow/digi0.gif" width=16 name=x>
<img height=21 src="wsX5Obj/Obj100_2/digi_yellow/digi0.gif" width=16 name=a>
<img height=21 src="wsX5Obj/Obj100_2/digi_yellow/digi0.gif" width=16 name=b>
<img height=21 src="wsX5Obj/Obj100_2/digi_yellow/digi_dp.gif" width=9 name=c>
<img height=21 src="wsX5Obj/Obj100_2/digi_yellow/digi0.gif" width=16 name=y>
<img height=21 src="wsX5Obj/Obj100_2/digi_yellow/digi0.gif" width=16 name=z>
<img height=21 src="wsX5Obj/Obj100_2/digi_yellow/digi_dp.gif" width=9 name=cz>
<img height=21 src="wsX5Obj/Obj100_2/digi_yellow/digi0.gif" width=16 name=d>
<img height=21 src="wsX5Obj/Obj100_2/digi_yellow/digi0.gif" width=16 name=e>
<img height=21 src="wsX5Obj/Obj100_2/digi_yellow/digi_dp.gif" width=9 name=f>
<img height=21 src="wsX5Obj/Obj100_2/digi_yellow/digi0.gif" width=16 name=g>
<img height=21 src="wsX5Obj/Obj100_2/digi_yellow/digi0.gif" width=16 name=h>
</td>
<td>[Tage : Stunden : Minuten : Sekunden] bis zum neuem Jahr.</td>
</tr>
</table>
</div>
Flash Countdown
Zur Ausführung dieses Skriptes wird der Adobe Flashplauer benötigt, der bei fast jedem Nutzer bereits installiert ist. Je nach Einstellung im Browser muss dieser für das Skript (oder alle Skripte) zugelassen werden.
Auch hier kann Form, Farbe des Skripts der Homepage angepasst werden, dazu die Hinweise beim Skript beachten.
ZIP-Datei in ein beliebiges Verzeichnis auf dem PC entpacken und das Verzeichnis "wsX5Obj" auf den Webserver in das Root-Verzeichnis kopieren.
Jeweiligen HTML-Code in den BODY-Bereich <body>....</body> der aufrufende Datei einfügen.
Eine demo.html ist beigefügt, die zum Test in das Root-Verzeichnis des Webservers kopiert werden kann.
Aufruf: "http://www.domain.tld/demo.html". Diese kann aber nicht durch einen Doppelklick ausgeführt werden.
Download Button
x runter geladen!
In diesen beiden Beispielen ist der Countdown auf den
31.12.2022 18:00 eingestellt:
In diesen beiden Beispielen ist der Countdown auf den
31.12.2018 18:00 eingestellt:
Code für den <BODY> Bereich
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000"
codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0"
width="280" height="42" id="countdown_h">
<param name="allowScriptAccess" value="sameDomain" />
<param name="movie" value="wsX5Obj/Obj100_3/countdown_h.swf" />
<param name="quality" value="high" />
<param name="wmode" value="transparent" />
<param name="flashvars" value="c=000000&j=2022&m=12&t=31&std=18&min=00&meinText=Die Zeit ist abgelaufen!" />
<embed src="wsX5Obj/Obj100_3/countdown_h.swf"
flashvars="c=000000&j=2020&m=12&t=31&std=18&min=00&meinText=Die Zeit ist abgelaufen!"
quality="high" wmode="transparent" width="300" height="42" name="countdown_h" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />
</object>

Die Variablen:
Datei = "countdown_h.swf" für horizontal oder "countdown_v.swf" für vertikal
c = Schriftfarbe (000000) ohne das Gatterzeichen (#)
j = Jahresangabe 4stellig; m = Monatsangabe; t = Tagesangabe
std = Stundenangabe; min = Minutenangabe; meinText = Dein Ausgabetext

Feedbacks zu ""
Kein Kommentar
Vielen Dank für Dein Feedback.
Logo Host Europe
Button Spenden

© 2009 - 2019





Besucher Statistik
» 3 Online
» 72 Heute
» 342 Gestern
» 838 Woche
» 2838 Monat
» 137755 Jahr
» 465511 Gesamt
Record: 2382 (29.03.2019)
Gesamt Downloads:
Hosting by
Zurück zum Seiteninhalt