• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Definierbarer Countdown

Status
Für weitere Antworten geschlossen.
W

Witschi262

Blogger
Hallo,
ich habe ein Projekt, beidem ein Benutzer schnell und einfach einen Freun ärgern kann.
Er kann ein Datum einstellen, und der Countdown wird dann erstellt.

Den Countdown dazu haben ich schon. Ich habe ihn durch Google gefunden:
HTML: 
<script language="JavaScript">
      // Ziel-Datum in MEZ
      var jahr=22, monat=2, tag=22, stunde=22, minute=22, sekunde=22;
      var zielDatum=new Date(jahr,monat-1,tag,stunde,minute,sekunde);

      function countdown() {
        startDatum=new Date(); // Aktuelles Datum

        // Countdown berechnen und anzeigen, bis Ziel-Datum erreicht ist
        if(startDatum<zielDatum)  {

          var jahre=0, monate=0, tage=0, stunden=0, minuten=0, sekunden=0;

          // Jahre
          while(startDatum<zielDatum) {
            jahre++;
            startDatum.setFullYear(startDatum.getFullYear()+1);
          }
          startDatum.setFullYear(startDatum.getFullYear()-1);
          jahre--;

          // Monate
          while(startDatum<zielDatum) {
            monate++;
            startDatum.setMonth(startDatum.getMonth()+1);
          }
          startDatum.setMonth(startDatum.getMonth()-1);
          monate--;

          // Tage
          while(startDatum.getTime()+(24*60*60*1000)<zielDatum) {
            tage++;
            startDatum.setTime(startDatum.getTime()+(24*60*60*1000));
          }

          // Stunden
          stunden=Math.floor((zielDatum-startDatum)/(60*60*1000));
          startDatum.setTime(startDatum.getTime()+stunden*60*60*1000);

          // Minuten
          minuten=Math.floor((zielDatum-startDatum)/(60*1000));
          startDatum.setTime(startDatum.getTime()+minuten*60*1000);

          // Sekunden
          sekunden=Math.floor((zielDatum-startDatum)/1000);

          // Anzeige formatieren
          (jahre!=1)?jahre=jahre+" Jahre,  ":jahre=jahre+" Jahr,  ";
          (monate!=1)?monate=monate+" Monate,  ":monate=monate+" Monat,  ";
          (tage!=1)?tage=tage+" Tage,  ":tage=tage+" Tag,  ";
          (stunden!=1)?stunden=stunden+" Stunden,  ":stunden=stunden+" Stunde,  ";
          (minuten!=1)?minuten=minuten+" Minuten  und  ":minuten=minuten+" Minute  und  ";
          if(sekunden<10) sekunden="0"+sekunden;
          (sekunden!=1)?sekunden=sekunden+" Sekunden":sekunden=sekunden+" Sekunde";

          document.countdownform.countdowninput.value=
              jahre+monate+tage+stunden+minuten+sekunden;

          setTimeout('countdown()',200);
        }
        // Anderenfalls alles auf Null setzen
        else document.countdownform.countdowninput.value=
            "0 Jahre,  0 Monate,  0 Tage,  0 Stunden,  0 Minuten  und  00 Sekunden";
      }
    </script>
  </head>

  <body onload="countdown()">
    <form name="countdownform">
      <p>
        <input size="75" name="countdowninput">
      </p>
    </form>

Nun möchte ich, dass der Benutzer aber das Datum selbst festlegen kann. Über ein sehr unschönes "prompt"- Fenster realisiert wurde.
Jedoch, als ich oben jeweils "+VARIABLE+" eingefügt habe, ging leider garnichts mehr.
(Variable habe ich natürlich durch eine variable erstezt!!)
Nun möchte ich diese unschöne Variante garnicht, sondern eine schöne Auswahlliste, Google hat mir da leider auch nicht mehr weiterhelfen können...

Bitte helfen :-)
 
Erstens. Das Script scheint mir schon etwas älter zu sein.
Schreib mal lieber <script type="text/javascript"> anstatt das language attribut zu benutzen.
Was deine Datumsauswahl angeht. Was für eine Auswahl willst du dennn haben?
Am leichtestens ging es natürlich mit PHP.
eine "Option" Schleife.
PHP: 
<?php

 function giveDateOptions($number) {
   $options  = ""
   for($i=1; $i <= $number; $i++) {
     $options .= "<option value='$i'>$i</option>";
   }
  return $options;
 }

?>
in JS geht es so ähnlich:

PHP: 
function giveDateOptions(number, selectElement) {
  for (var i=0; i <= number; i++) {
    var option = document.createElement("option");
    option.value = i;
    option.innerHTML = i;
    selectElement.appendChild(option);
  }
 return selectElement;
}
Alles ungetestet. Aber dürfte gehen.
Würde an deiner Stelle lieber die PHP Variante nehmen.
Für Jahre musst du das ganze Natrlich auch abändern, sodass der Startwert auch setzbar ist.
Aber das war mal ein Denkanstoß für dich ;)
 
Danke Gilles :D
Hm, naja wir haben uns umendschieden.

Wir wollen websites, den "Tod" vorraussagen, natürlich dient alles nur der Unterhaltung !!
 
Status
Für weitere Antworten geschlossen.

Neueste Beiträge

Zurück
Oben