• Das Erstellen neuer Accounts wurde ausgesetzt. Bei berechtigtem Interesse bitte Kontaktaufnahme über die üblichen Wege. Beste Grüße der Admin

[JavaScript] Countdownzähler

... vielleicht gefällt dir das?

Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de" dir="ltr">
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<meta http-equiv="content-script-type" content="text/javascript" />
<meta http-equiv="content-style-type" content="text/css" />
<meta http-equiv="content-language" content="de" />
<title>Countdown</title>

<style type="text/css">
<!--
#shade
{
	font-family: Arial, sans-serif;
	font-weight: bold;
	font-size: 13px;
	color: #000;
}
//-->
</style>

<script type="text/javascript">
<!--
function zeit_anzeigen()
{
	var Jahr    = 2006;
	var Monat   = 12;
	var Tag     = 24;
	var Stunde  = 12;
	var Minute  = 0;
	var Sekunde = 0;

	var now  = new Date();
	var then = new Date(Jahr, (Monat - 1), Tag, Stunde, Minute, Sekunde);
	var diff = then.getTime() - now.getTime();
	var rap1 = rap2 = rap3 = rap4 = 0;

	if (diff >= 0)
	{
		var gap4 = Math.floor(diff / (1000));
		var gap3 = Math.floor(gap4 / (60));
		var gap2 = Math.floor(gap3 / (60));
		var gap1 = Math.floor(gap2 / (24));

		rap1 = Math.floor(gap1);
		rap2 = Math.floor(gap2 - (gap1 * 24));
		rap3 = Math.floor(gap3 - (gap2 * 60));
		rap4 = Math.floor(gap4 - (gap3 * 60));
	}

	var Zeit = rap1 + ' Tage' + ((rap1 == 1) ? '' : 'n') + ', ' + rap2 + ' Stunde' + ((rap2 == 1) ? '' : 'n') + ', '
	         + rap3 + ' Minute' + ((rap3 == 1) ? '' : 'n') + ', ' + rap4 + ' Sekunde' + ((rap4 == 1) ? '' : 'n');

	with (document)
		getElementById('shade').firstChild.nodeValue = Zeit;

	if (diff >= 0)
		setTimeout('zeit_anzeigen();', 1000);
}

onload = zeit_anzeigen;
//-->
</script>

</head>
<body>

<span id="shade"> </span>

</body>
</html>
 
Zuletzt bearbeitet:
Jetzt versteh ich gar nichts mehr! Ich habe ersteinmal die Kopfzeile mit php geändert (ein Dankeschön für den Code an dieser Stelle). Weil der Validator gemeckert hat, text/html ist falsch habe ich es in application/xhtml+xml verändert. Der liebe Validator sagt mir aber immernoch das ich MIME-Type ändern soll. Außerdem wird genauso gesagt ich verwende ISO, obwohl ich angegeben habe, dass es UTF-8 ist. Was ist los, was soll ich tun?

Danke für das andere Countdown-Script, aber ich bin ganz zuversichtlich, dass hier noch zu schaffen. Bald sind ja alle Probleme beseitigt. (Jedenfalls wenn alles glatt geht und ich auf eure Hilfe hoffen kann.)

mit freundlichen Grüßen.
 
Es handelt sich lediglich um einen Hinweis.
In diesem Hinweis ist ein Link enthalten zu den 'Richtlinien zur HTML-Kompatibilität'.
XHTML 1.0: Die Extensible HyperText Markup Language (Zweite Auflage) - 1 Was ist XHTML?
C.1 Verarbeitungsanweisungen und die XML-Deklaration

Beachten Sie, dass Verarbeitungsanweisungen auf einigen Benutzerprogrammen dargestellt werden. Außerdem interpretieren einige Benutzerprogramme die XML-Deklaration so, als ob sie unbekanntes XML statt HTML vor sich hätten; und folglich stellen sie das Dokument nicht wie erwartet dar. Zur Kompatibilität mir diesen alten Browsern können Sie auf Verarbeitungsanweisungen und XML-Deklarationen verzichten. Beachten Sie jedoch auch, dass, wenn die XML-Deklaration nicht in ein Dokument aufgenommen ist, das Dokument nur die Standard-Zeichencodierungen UTF-8 oder UTF-16 verwenden kann.
Außerdem wird genauso gesagt ich verwende ISO, obwohl ich angegeben habe, dass es UTF-8 ist. Was ist los, was soll ich tun?
Dann sendet der Server diesen ISOquatsch.
Musst Du mal 'Erweiterte Einstellungen' -> 'Headerdaten anzeigen' anticken und gucken... (Validome)
 
Zuletzt bearbeitet:
Hmm, so langsam geht es nicht mehr nur um den Countdownzähler, sondern um ds XHTML an sich. Da stekce ich im Moment in einer Krise, weil ich einfach nicht weis was zu tun ist.
Egal was ich mache, den Validator bekomme ich nicht zufrieden gestellt was die Zeichensatzcodierung und den MIME-Type angeht. Ich halte es im Moment für unmöglich eine valide Seite zu erstellen, aber es muss ja irgendwie gehen. Jetzt wirklich mal abgesehen vom Countdownzähler: So sieht mein Grundgerüst aus, aber ohne Hinweise Warnungen und Fehler bekomme ich es nicht hin. Man kann nicht zufällig bestimmten welche Codierung im HTTP-Header übertragen werden soll, oder?

Code:
<?php
echo "<?xml version='1.0' encoding='UTF-8' ?>";
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de">

<head>
<title>Seite</title>
<meta http-equiv="content-type" content="application/xhtml+xml; charset=UTF-8" />
</head>

<body>
<p>
Text
</p>
</body>

</html>

Das ist ja irgendwie nicht in Ordnung...:(

mfg.
 
Zuletzt bearbeitet:
Puh, jetzt kann ich hier alle beruigen, denen ich so langsam auf die Nerfen gehe: Die Sache mit dem Validator ist gegessen. Danke an René und natürlich auch an alle die bei vorherigen Problemem mitgeholfen haben. Valide ist die Seite, wenn ich das einfüge:
Code:
<?php
header("content-type:application/xhtml+xml; charset=UTF-8");
echo "<?xml version='1.0' encoding='UTF-8' ?>";
?>
Wieder etwas geklärt. Nun, zu letzt, möchte ich nochmal Back-to-Topik. Der Zähler, ist ja nun schon etwas geändert. Was bleibt ist folgendes:
Im Übrigen: warum ein Textfeld, wenn es mit getElementById referenziert wird? Die Dinger hat man früher für sowas genommen, da man ihren value schön kompatibel manipulieren konnte. Das wird hinfällig, wenn sie nicht als Formularelement angesprochen werden.
Wie denn anders? Also soweit ich verstanden habe wäre es besser es per p oder sontigem Element einzufügen. Bei mir funktioniert es nicht wie gewünscht. Kann mir da noch einer behilflich sein?

^^
THX
mfg.
 
Dann sendet der Server diesen ISOquatsch.
Musst Du mal 'Erweiterte Einstellungen' -> 'Headerdaten anzeigen' anticken und gucken... (Validome)
Hab ich doch gesagt...
Der Server hat das ISOzeugs gesendet und Du hast das jetzt durch einen eigenen, mitgesendeten Header übergangen...
 
Ja, du hattest ja recht. ^^ Ich kene mich nur mit Serverseitigen Sachen nicht so aus. Und da ich kein php kann, musste ich erstmal nachgucken was da zu machen ist.

*leiseSprech* aber was ist nun mit dem p-Tag. Das ist die letzte Kritik, die noch nicht beseitigt ist.

mfg.
 
Joa,, also mein Versuch war so ne ganz primitive Sache.. Ich habe einfach versucht wie im input Tag per id attribut in p einzubinden. Aber da ich nicht so wirklich fitt in javascript bin ist das alles nichts geworden mit innerHTML. Bei value hab ich allerdings nichts gemacht.

mfg und angenehme nachruhe.^^
 
Hmm, es wird sich geweigert mir sofort zu sagen was falsch ist.. Naja, kann ich verstehen, schließlich soll ich selber mal nachdenken, ausprobieren und lernen. Ich habs jetzt nochmal versucht, es ein bisschen umzuschreiben und deine Zeile mit getElementById zu übernehmen. Ich schaffe es aber nicht die Variablen richtig anzupassen. Was ich auch vermisse ist die Möglichkeit nach Ablauf des Countdowns einen Text anzeigen zu lassen. Also wie "Countdown beendet". Ich hoffe es ist möglich, ohne dass ich diese Funktion einbüßen muss.

mfg.
 
Felidae schrieb:
Hmm, es wird sich geweigert mir sofort zu sagen was falsch ist..
Der Einzige, der sich hier weigert bist Du! Wie soll Dir jemand sagen, was Du falsch gemacht hast, wenn Du konsequent mit Deinem gescheiterten Versuch in der Versenkung bleibst?

Wie es gehen kann siehst Du in Renés Beispiel. Wenn Du wissen willst, was bei Dir nicht stimmte rück in drei Teufels Namen endlich mit Deinem Ansatz raus!
 
Okok, ich wollte im letzetn Beitrag auch nicht motzen oder rumbrüllen, das war nicht so gemeint. Ich habe ja extra geschrieben das ich es verstehen kann. Aber ok, nun mein Anstaz, der euch warscheinlich köstlich amüsieren wird -->

Meine "logig" die dahinter steckt: Wenn man das Teil per <input id="countdowninput"> einbinden kann, dann müsste es ja auch per <p id="countdowninput"> gehen. Falsch gedacht, aber so habs ichs mal gemacht:
Code:
<body onload="countdown()">
<p id="countdowninput">
</p>
</body>

Das was ich mit René´s gemacht habe ist noch viel verrückter. Wobei ich grade sehe, das ich etwas davon übersprungen habe. Aber da ich nicht weis, welche Variablen ich wie änder muss hab ichs damit auch nicht geschafft.
 
... was nützt uns dein <p id="irgendwas"> wenn du den dazu gehöhrigen JavaScript-Code nicht mit postest.

Und statt dem getElementById.value nimm doch mal das was Pit geschrieben hat.

Und die Sache mit "wenn Counter fertig mit zählen ist" ist von der Sache her auch schon in meinem Beispiel-Code enthalten, nur das er bei mir dann bei 0 Tage 0 Stunden ... stehen bleibt.
 
Zuletzt bearbeitet:
Hi, den dazugehörigen javascript-code hab ich nicht mitgepostet, weil er ja unter der angegeben Adresse im Startbeitrag zu finden ist. Und bevor hier zu viel "ünnützes" gepostet wird habe ich ihn weggelassen. Wenns hilft poste ich aber gerne noche inmal hinterher:
Code:
<?php
header("content-type:application/xhtml+xml; charset=UTF-8");
echo "<?xml version='1.0' encoding='UTF-8' ?>";
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de">

<head>
<title>Countdown</title>
<meta http-equiv="Content-Script-Type" content="text/javascript" />
<script type="text/javascript">
/* <![CDATA[ */
var year=2007, month=08, day=02, hour=00, minute=00, second=00;
var enddate=new Date(year, month-1, day, hour, minute, second);
function countdown()
{
startdate=new Date();
if(startdate<enddate)
{
var days=0, hours=0, minutes=0, seconds=0;
while(startdate.getTime()+(24*60*60*1000)<enddate)
{
days++;
startdate.setTime(startdate.getTime()+(24*60*60*1000));
}
hours=Math.floor((enddate-startdate)/(60*60*1000));
startdate.setTime(startdate.getTime()+hours*60*60*1000);
minutes=Math.floor((enddate-startdate)/(60*1000));
startdate.setTime(startdate.getTime()+minutes*60*1000);
seconds=Math.floor((enddate-startdate)/1000);
(days!=1)?days=days+" Tage, ":days=days+" Tag, ";
(hours!=1)?hours=hours+" Stunden, ":hours=hours+" Stunde, ";
(minutes!=1)?minutes=minutes+" Minuten und ":minutes=minutes+" Minute und ";
if(seconds<10) seconds="0"+seconds;
(seconds!=1)?seconds=seconds+" Sekunden":seconds=seconds+" Sekunde";
document.getElementById("countdowninput").value=days+hours+minutes+seconds;
setTimeout("countdown()", 1000);
}
else document.getElementById("countdowninput").value="Countdown beendet";
}
/* ]]> */
</script>
</head>

<body onload="countdown()">
<p>
<input id="countdowninput" readonly="readonly" size="46" />
</p>
</body>

</html>

mfg.
 
Ich ignoriere das was du gepostet hast natürlich nicht absichtlich, ich habe schon wie verückt versucht da was mit value an innerHTML und so zu drehen, aber von javascript habe ich nicht so eine Ahnung. Das getElementById hat mir schon öffters Probleme gemacht, weil ich einfach nicht weis, wie ich es besser machen kann. Tut mir echt leid, bin halt noch Anfänger, der grade mal eine HP mithilfe von XHTML und CSS gemacht hat. javascript nur so ein bisschen.

so, ist es mal wieder Abend geworden.. Gute Nacht.
 
Zurück
Oben