Countdown zum neuen Jahr, verschiedene andere Countdowns für Ihre Homepage

Einen Countdown zum neuen Jahr (oder auch zu einem anderen beliebigem Datum) können Sie als Script auf Ihrer Webseite einbauen oder Sie bauen einen gehosteten Countdown auf Ihrer Webseite ein.

So sieht z.B. ein Javascript-Countdown zum neuen Jahr aus:

Die Zeitspanne ist immer korrekt, sogar die Zeitverschiebung durch die Sommerzeit wird berücksichtigt (daher wirkt es so, als wenn der Countdown während der Sommerzeit eine Stunde zuviel anzeigt. Dies ist aber die Stunde, die bei der Umstellung auf Winterzeit den Countdown verlängert.)

Hier die englische Einbauanleitung von The JavaScript Source in deutscher Übersetzung und leicht modifiziert (für den automatischen Neustart in jedem Jahr):

<!-- In 3 Schritten zum digitalen Countdown:

1.  Den 1. Teil in den HEAD-Bereich ihres HTML-Dokumentes einfügen
  2.  Den "onLoad event handler" im BODY-Tag einfügen
  3.  Der letzte Code-Schnipsel in dem BODY-Bereich an der Stelle einfügen, an der der 
  Countdown ausgegeben werden soll  -->

<HEAD>

<!-- Begin
//Created by DendE PhisH
function getTime() {
c1 = new Image(); c1.src = "1c.gif";
c2 = new Image(); c2.src = "2c.gif";
c3 = new Image(); c3.src = "3c.gif";
c4 = new Image(); c4.src = "4c.gif";
c5 = new Image(); c5.src = "5c.gif";
c6 = new Image(); c6.src = "6c.gif";
c7 = new Image(); c7.src = "7c.gif";
c8 = new Image(); c8.src = "8c.gif";
c9 = new Image(); c9.src = "9c.gif";
c0 = new Image(); c0.src = "0c.gif";
Cc = new Image(); Cc.src = "Cc.gif";
now = new Date();

//ENTER BELOW THE DATE YOU WISH TO COUNTDOWN TO
later = new Date("Jan 1 " + (parseInt(new Date().getFullYear())+1) + " 00:00:00");

days = (later - now) / 1000 / 60 / 60 / 24;
daysRound = Math.floor(days);
hours = (later - now) / 1000 / 60 / 60 - (24 * daysRound);
hoursRound = Math.floor(hours);
minutes = (later - now) / 1000 /60 - (24 * 60 * daysRound) - (60 * hoursRound);
minutesRound = Math.floor(minutes);
seconds = (later - now) / 1000 - (24 * 60 * 60 * daysRound) - (60 * 60 * hoursRound) - (60 * minutesRound);
secondsRound = Math.round(seconds);

if (secondsRound <= 9) {
document.images.g.src = c0.src;
document.images.h.src = eval("c"+secondsRound+".src");
}
else {
document.images.g.src = eval("c"+Math.floor(secondsRound/10)+".src");
document.images.h.src = eval("c"+(secondsRound%10)+".src");
}
if (minutesRound <= 9) {
document.images.d.src = c0.src;
document.images.e.src = eval("c"+minutesRound+".src");
}
else {
document.images.d.src = eval("c"+Math.floor(minutesRound/10)+".src");
document.images.e.src = eval("c"+(minutesRound%10)+".src");
}
if (hoursRound <= 9) {
document.images.y.src = c0.src;
document.images.z.src = eval("c"+hoursRound+".src");
}
else {
document.images.y.src = eval("c"+Math.floor(hoursRound/10)+".src");
document.images.z.src = eval("c"+(hoursRound%10)+".src");
}
if (daysRound <= 9) {
document.images.x.src = c0.src;
document.images.a.src = c0.src;
document.images.b.src = eval("c"+daysRound+".src");
}
if (daysRound <= 99) {
document.images.x.src = c0.src;
document.images.a.src = eval("c"+Math.floor((daysRound/10)%10)+".src");
document.images.b.src = eval("c"+Math.floor(daysRound%10)+".src");
}
if (daysRound <= 999){
document.images.x.src = eval("c"+Math.floor(daysRound/100)+".src");
document.images.a.src = eval("c"+Math.floor((daysRound/10)%10)+".src");
document.images.b.src = eval("c"+Math.floor(daysRound%10)+".src");
}
newtime = window.setTimeout("getTime();", 1000);
}
//  End -->
</script>

</HEAD>

<div align="center">
<h3>Countdown zum neuen Jahr 2005</h3>
</div>

<div align="center">
<h4>(Tage : Stunden : Minuten : Sekunden)</h4>
</div>

<p><center>
<font face="arial, helvetica" size"-2">Kostenloses JavaScript von<br>
<a href="http://javascriptsource.com">The JavaScript Source</a></font>
</center><p>

Zum Zieldatum:

Im vorgefertigten Script ist angegeben:

later = new Date("Jan 1 " + (parseInt(new Date().getFullYear())+1) + " 00:00:00");

Diese Angabe sorgt dafür, dass das Script exakt bis Neujahr zählt und automatisch jedes Jahr nach Erreichen des Datums weiterzählt.

Bei einem anderen Datum müssen Sie diese Angabe ersetzen durch:

later = new Date("Jan 5 2007 0:00:01");

Das Datum bitte entsprechend Ihren Wünschen anpassen.

Ganz fertig sind Sie jetzt noch nicht - Sie benötigen noch die Grafiken für den Countdown. Bitte die nachfolgenden Grafiken mit der rechten Maustaste anklicken und im gleichen Verzeichnis speichern, in dem auch der Countdown laufen soll. Bitte nicht die Namen der Bilder ändern - da das Script sonst nicht funktioniert.

Anbieter von Countdown-Scripten bzw. von gehosteten Countdowns:

www.a-n-v.de - hier bekommen Sie u.a. einen Neujahres-Countdown bietet Ihnen an. Der Countdown zählt die Tage, Stunden und Minuten bis zum neuen Jahr. Es gibt viele verschiedene Möglichkeiten, den Countdown anzuzeigen. Hier einige Beispiele:

Tage, Stunden und Minuten bis Neujahr:

Stunden und Minuten bis Neujahr:

Tage bis Neujahr:

Neben unserem Kalendersystem kann der Countdown auch auf den Jüdischen Kalender, Islamischen Kalender und weitere Kalender eingestellt werden. Das Aussehen des Countdowns kann aus verschiedenen Vorlagen ausgewählt werden.
countdown.onlineclock.net/generator/ - Javascript-Countdown-Generator
www.coolplace.cc/generatoren/countdown-generator - Javascript-Countdown-Generator
www.counto.com - bei Counto.com können Sie einen Flash-Countdown für die eigene Homepage bekommen. Sie legen das Zieldatum inkl. Uhrzeit fest, dazu können sehr viele Designeinstellungen vorgenommen werden. Der Countdown kann auch anders herum zählen, d.h. wie weit ein Ereignis entfernt ist. Hier am Beispiel des Alters von meine-erste-homepage.com:
www.daisypath.com/Holidays.php - hier können Sie verschiedene Feiertag-Countdowns bekommen, nachfolgend einige Beispiele:

Countdown bis zum Valentinstag:

Countdown bis Halloween

Countdown bis Weihnachten:
www.dynamicdrive.com/dynamicindex6/dhtmlcount.htm - hier bekommen Sie ein eEin DHTML-Countdown-Script
www.lilypie.com - bei Lilypie.com können Sie einen Countdown bis zum wahrscheinlichen Geburtstermin Ihres Kindes bekommen. Später, wenn das Baby dann da ist, können Sie eine Grafik bekommen, die Ihnen das taggenaue Alter Ihres Babys anzeigt. Sie können auch eine Grafik bis zum nächsten Geburtstag Ihres Kindes bekommen.
www.magic-webdesign.de/online-generator/countdown-generator - hier können Sie sich mit einem Generator einen Javascript-Countdown erstellen lassen.
online-stopwatch.en.downloadastro.com/tools/ - hier gibt es eine Online-Uhr, die als Uhr, Alarm, Timer, Stopuhr und Countdown genutzt werden kann. Die Seite ist werbefrei und sehr einfach zu nutzen. Hier ein Beispiellink Countdown bis zum Heiligen Abend 2015: online-countdown.en.downloadastro.com/tools/#1450976400000_V2VpaG5hY2h0ZW4gMjAxNQ==
www.satisfaction.com/countdown-generator - Flash-Countdown-Generator
www.tickerfactory.com - hier finden Sie einen sehr originellen grafischen Countdown für Ihre Homepage. Sie wählen einen Designhintergrund, die Countdowngrafik, die sich täglich dem Ziel weiter nähert und legen dann noch das Datum und den Namen des Zieldatums fest.
timeline.verite.co - hier gibt es wunderschöne "Timelines" - u.a. auch individuell erstellte zum Einbinden für die eigene Webseite. Hier als Beispiel die Timeline für Withney Houston: timeline.verite.co/examples/houston
www.webcountdown.de/web/developer.html - Webcountdown - jetzt auch für die eigene Homepage
www.webgamedesign.com/countdown.php - Flash-Countdown-Generator
www.web-toolbox.net/webtoolbox/zeit/sylvester/sylvester.htm - hier finden Sie einen schönen Fullscreen-Countdown z.B. für Ihre Silvester- oder Geburtstagsparty realisiert über eine HTML-Seite.

Countdown zum neuen Jahr, verschiedene andere Countdowns für Ihre Homepage

Einen Countdown zum neuen Jahr (oder auch zu einem anderen beliebigem Datum) können Sie als Script auf Ihrer Webseite einbauen oder Sie bauen einen gehosteten Countdown auf Ihrer Webseite ein.

Weitere interessante Rubriken / Webseiten zu diesem Themenbereich:

Hier die neuesten Postings aus unserem Homepage-Forum: