Javascript auf Webseite anzeigen

  • Ich habe eine Javascript Code gefunden
    http://www.kostenlose-javascripts.de...Countdown.html,
    den ich gerne auf meiner Webseite einbinden möchte. Leider habe ich keine Ahnung von Javascript. Wie zeige ich das Ganze an, weil bei mir kommt nur eine weisse Seite? Google sagt mir, dass ich das mit OnLoad funktion machen muss. Aber das geht irgendwie nicht. Wie muss ich das machen?


    HTML-Code:
    <html>
    <head>
    </head>
    <body>
    <div align="center" id="countdown" style="font-size:1.3em; font-weight:medium; font-family:Times New Roman, sans serif; "></div>
    <script type="text/javascript">
    <!--//


    /*DEFINITION VON END-DATUM, FARBEN UND TEXTEN BEGINNT HIER*/


    EndYear = 2013; //End-Jahr als 4-Stellige Zahl
    EndMonth = 12; //End-Monat als Zahl (1 für Januar)
    EndDay = 21; //End-Tag als Zahl (1 für den 1.)
    PreEndHour = 16; //End-Stunde als Zahl (3 für 3 uhr [UTC] [In der SZ 2 St., in der WZ 1 St. früher als in Deutschl. ] )
    PreEndMinute = 0; //End-Minute als Zahl (2 für z.B.: 19:02 )
    EndSecond = 0;//End-Sekunde als Zahl (2 für z.B.: 19:17"02 )
    NormColor = 'rgb(0,0,0)'; //Normale Farbe des Countdowns Siehe #
    TenColor = 'rgb(190,34,5)' //Farbe bei den letzten 10 Sekunden Siehe #
    EndColor = 'rgb(213,43,13)'; //Farbe, wenn der Countdown bereits abgelaufen ist Siehe #
    TextA = 'There are'; //Text der über dem Countdown steht. Nur MIT Anführungstrichen
    TextZ = 'left until...'; //Text der unter dem Countdown steht. Nur MIT Anführungstrichen
    EndText = 'The time has come!'; /*Text der angezeigt wird, wenn der Countdown bereits abgelaufen ist. Nur MIT Anführungstrichen
    // #1. Zahl für Rot-Anteil, 2. Zahl für Grün-Anteil, 3. Zahl für Blau-Anteil (Werte zwischen 0 und 255). Tabelle Farbfinder gibt es hier: http://www.npage.de/php-bin/se….php?feld=url_farbe&set=0
    (Farbe auswählen und dann die einzelnen Werte kopieren [R,G und B] und hier einfügen.)


    /*DEFINITION ENDET HIER: AB HIER SOLLTE NICHTS VERÄNDERT WERDEN.*/


    EndMonth--;
    CD = window.setInterval('CountDown()',1000);
    function CountDown(){
    ActDate = new Date();
    ActTime = ActDate.getTime();
    if (ActDate.getDate() != ActDate.getUTCDate()){
    ActHour = ActDate.getHours() +24;
    } else {
    ActHour = ActDate.getHours();
    }
    UtcDiffH = ActHour - ActDate.getUTCHours();
    EndHour = PreEndHour + UtcDiffH;
    UtcDiffM = ActDate.getMinutes() - ActDate.getUTCMinutes();
    EndMinute = PreEndMinute + UtcDiffM;
    DayM = 24*60;
    EndClockM = (60*EndHour) +EndMinute;
    if (EndClockM > DayM){
    EndDay++;
    EndClockM = EndClockM - DayM;
    } else if (EndClockM == DayM){
    EndDay++;
    EndClockM = 0;
    }
    EndHourFalse = EndClockM/60;
    EndHour = Math.floor(EndHourFalse);
    EndMinute = EndClockM - (60*EndHour);
    EndDate = new Date(EndYear, EndMonth, EndDay, EndHour, EndMinute, EndSecond);
    EndTime = EndDate.getTime();
    DiffTime = EndTime - ActTime;
    DaysFalse = DiffTime/1000/60/60/24;
    Days = Math.floor(DaysFalse);
    HoursFalse = DiffTime/1000/60/60;
    Hours = Math.floor(HoursFalse) - (24*Days);
    MinutesFalse = DiffTime/1000/60;
    Minutes = Math.floor(MinutesFalse) - (60*24*Days) - (60*Hours);
    SecondsFalse = DiffTime/1000;
    Seconds = Math.floor(SecondsFalse) - (60*60*24*Days) - (60*60*Hours) - (60*Minutes);
    if (Minutes == 60){
    M = 0;
    } else {
    M = Minutes;
    }
    if (Seconds == 60){
    S = 0;
    } else {
    S = Seconds
    }
    if (Lang == 'DE'){
    if (Days == 1){
    Day = 'Day';
    } else {
    Day = 'Days';
    }
    if (Hours == 1){
    Hour = 'Hour';
    } else {
    Hour = 'Hours';
    }
    if (Minutes == 1){
    Minute = 'Minute';
    } else {
    Minute = 'Minutes';
    }
    if (Seconds == 1){
    Second = 'Second';
    } else {
    Second = 'Seconds';
    }
    document.getElementById('countdown').innerHTML = '<span style="color:' + NormColor + '; ">' + TextA + '<br><br><span style="font-size:1.3em; ">' + Days + ' ' + Day +',<br>' + Hours + ' ' + Hour + ',<br>' + M + ' ' + Minute + ' and<br>' + S + ' ' + Second + '<br><br><\/span>' + TextZ + ',<br><br>on ' + EndDate + ' (local time)<\/span>';
    }
    if (Days == 0 && Hours == 0 && Minutes == 0 && Seconds < 11){
    document.getElementById('countdown').innerHTML = '<span style="font-size:300px; color:' + TenColor + '; ">' + Seconds + '<\/span>';
    }
    if (Days == 0 && Hours == 0 && Minutes == 0 && Seconds == 0){
    window.clearInterval(CD);
    document.getElementById('countdown').innerHTML = '<span style="font-size:7em; color:' + EndColor + '; ">' + EndText + '<\/span>';
    }
    if (DiffTime < 0){
    window.clearInterval(CD);
    document.getElementById('countdown').innerHTML = '<span style="font-size:7em; color:' + EndColor + '; ">' + EndText + '<\/span>';
    }
    }
    </script>
    </body>
    </html>

  • na du hast da doch das komplette ding als html und so sollte es doch auch lauffähig sein...


    du brauchst nen div mit der ID countdown
    und dann hauste das javascript am besten in deinen body, kurz vorm schliessenden bodytag.


    alternativ hau das script in den head und schreibe

    Code
    1. window.onload = function(){
    2. CD = window.setInterval('CountDown()',1000);
    3. }


    dann musste aber diese zeile hier: CD = window.setInterval('CountDown()',1000); aus deinem script selber entfernen

  • So oder? Aber dann ist immer noch alles weiss.
    [/CODE]
    <html>
    <head>


    </head>
    <body>
    <div align="center" id="countdown" style="font-size:1.3em; font-weight:medium; font-family:Times New Roman, sans serif; "></div>
    <script type="text/javascript">
    <!--//


    /*DEFINITION VON END-DATUM, FARBEN UND TEXTEN BEGINNT HIER*/


    EndYear = 2013; //End-Jahr als 4-Stellige Zahl
    EndMonth = 12; //End-Monat als Zahl (1 für Januar)
    EndDay = 21; //End-Tag als Zahl (1 für den 1.)
    PreEndHour = 16; //End-Stunde als Zahl (3 für 3 uhr [UTC] [In der SZ 2 St., in der WZ 1 St. früher als in Deutschl. ] )
    PreEndMinute = 0; //End-Minute als Zahl (2 für z.B.: 19:02 )
    EndSecond = 0;//End-Sekunde als Zahl (2 für z.B.: 19:17"02 )
    NormColor = 'rgb(0,0,0)'; //Normale Farbe des Countdowns Siehe #
    TenColor = 'rgb(190,34,5)' //Farbe bei den letzten 10 Sekunden Siehe #
    EndColor = 'rgb(213,43,13)'; //Farbe, wenn der Countdown bereits abgelaufen ist Siehe #
    TextA = 'There are'; //Text der über dem Countdown steht. Nur MIT Anführungstrichen
    TextZ = 'left until...'; //Text der unter dem Countdown steht. Nur MIT Anführungstrichen
    EndText = 'The time has come!'; /*Text der angezeigt wird, wenn der Countdown bereits abgelaufen ist. Nur MIT Anführungstrichen
    // #1. Zahl für Rot-Anteil, 2. Zahl für Grün-Anteil, 3. Zahl für Blau-Anteil (Werte zwischen 0 und 255). Tabelle Farbfinder gibt es hier: http://www.npage.de/php-bin/seiten/c...rl_farbe&set=0
    (Farbe auswählen und dann die einzelnen Werte kopieren [R,G und B] und hier einfügen.)


    /*DEFINITION ENDET HIER: AB HIER SOLLTE NICHTS VERÄNDERT WERDEN.*/


    EndMonth--;
    CD = window.setInterval('CountDown()',1000);
    function CountDown(){
    ActDate = new Date();
    ActTime = ActDate.getTime();
    if (ActDate.getDate() != ActDate.getUTCDate()){
    ActHour = ActDate.getHours() +24;
    } else {
    ActHour = ActDate.getHours();
    }
    UtcDiffH = ActHour - ActDate.getUTCHours();
    EndHour = PreEndHour + UtcDiffH;
    UtcDiffM = ActDate.getMinutes() - ActDate.getUTCMinutes();
    EndMinute = PreEndMinute + UtcDiffM;
    DayM = 24*60;
    EndClockM = (60*EndHour) +EndMinute;
    if (EndClockM > DayM){
    EndDay++;
    EndClockM = EndClockM - DayM;
    } else if (EndClockM == DayM){
    EndDay++;
    EndClockM = 0;
    }
    EndHourFalse = EndClockM/60;
    EndHour = Math.floor(EndHourFalse);
    EndMinute = EndClockM - (60*EndHour);
    EndDate = new Date(EndYear, EndMonth, EndDay, EndHour, EndMinute, EndSecond);
    EndTime = EndDate.getTime();
    DiffTime = EndTime - ActTime;
    DaysFalse = DiffTime/1000/60/60/24;
    Days = Math.floor(DaysFalse);
    HoursFalse = DiffTime/1000/60/60;
    Hours = Math.floor(HoursFalse) - (24*Days);
    MinutesFalse = DiffTime/1000/60;
    Minutes = Math.floor(MinutesFalse) - (60*24*Days) - (60*Hours);
    SecondsFalse = DiffTime/1000;
    Seconds = Math.floor(SecondsFalse) - (60*60*24*Days) - (60*60*Hours) - (60*Minutes);
    if (Minutes == 60){
    M = 0;
    } else {
    M = Minutes;
    }
    if (Seconds == 60){
    S = 0;
    } else {
    S = Seconds
    }
    if (Lang == 'DE'){
    if (Days == 1){
    Day = 'Day';
    } else {
    Day = 'Days';
    }
    if (Hours == 1){
    Hour = 'Hour';
    } else {
    Hour = 'Hours';
    }
    if (Minutes == 1){
    Minute = 'Minute';
    } else {
    Minute = 'Minutes';
    }
    if (Seconds == 1){
    Second = 'Second';
    } else {
    Second = 'Seconds';
    }
    document.getElementById('countdown').innerHTML = '<span style="color:' + NormColor + '; ">' + TextA + '<br><br><span style="font-size:1.3em; ">' + Days + ' ' + Day +',<br>' + Hours + ' ' + Hour + ',<br>' + M + ' ' + Minute + ' and<br>' + S + ' ' + Second + '<br><br><\/span>' + TextZ + ',<br><br>on ' + EndDate + ' (local time)<\/span>';
    }
    if (Days == 0 && Hours == 0 && Minutes == 0 && Seconds < 11){
    document.getElementById('countdown').innerHTML = '<span style="font-size:300px; color:' + TenColor + '; ">' + Seconds + '<\/span>';
    }
    if (Days == 0 && Hours == 0 && Minutes == 0 && Seconds == 0){
    window.clearInterval(CD);
    document.getElementById('countdown').innerHTML = '<span style="font-size:7em; color:' + EndColor + '; ">' + EndText + '<\/span>';
    }
    if (DiffTime < 0){
    window.clearInterval(CD);
    document.getElementById('countdown').innerHTML = '<span style="font-size:7em; color:' + EndColor + '; ">' + EndText + '<\/span>';
    }
    }
    </script>
    <div id="countdown"></div>
    </body>
    </html>
    [/CODE]


  • da war noch ne unsinnige sprachabfrage drin... und dein code is auch unfug gewesen, weil du das element countdown doppelt hattest

  • Vielen Dank für deine Hilfe.
    Aber es geht einfach nicht. Ich habe es genau so hochgeladen, wie es im Code steht, denn du für mich bearbeitet hast. Die Webseite ist nur weiss.


    Dieses Script zB geht Problemlos, aber es hat leider keine Zeitzonen Funktion.

  • sorry, da is wohl beim editieren meines posts was zerschreddert worden, war grad selber erstaunt, da ich es zuvor getestet hatte.
    wie dem auch sei, ich habs dir nochmal korrigiert..