Countdown zähler erstellen bzw. Design ändern.

xxCyRiuSxx · 02.05.2011

Hey guten Tag zusammen, ich habe mal eine Frage und zwar (will jetzt nicht unverschämt klingen) aber könnte vielleicht einer von euch Pros mir so einen Countdown zähler basteln?

Ich habe jetzt schon einen nur der is nicht wirklich das was ich möchte

Code:

<script language="JavaScript">
// Ziel-Datum in MEZ
      var jahr=2012, monat=4, tag=30, stunde=00, minute=00, sekunde=00;
      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;

          // 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+" Std.,  ":stunden=stunden+" Std.,  ";
          (minuten!=1)?minuten=minuten+" Min.  und  ":minuten=minuten+" Min.  und  ";
          if(sekunden<10) sekunden="0"+sekunden;
          (sekunden!=1)?sekunden=sekunden+" Sek.":sekunden=sekunden+" Sek.";

          document.countdownform.countdowninput.value=
              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";
      }

Erzählt zwar runter aber das Design ist nicht so sonderlich ich hätte gerne sowas in der art wenn das möglich wäre und nicht zu viel Arbeit in Anspruch nimmt.

Wenn möglich dann bitte mit dreistelligen Tagen.

Ich hab schon mal nen Blick in den Quelltext geworfen hab aber leider nichts gefunden ...

Lg

fakerer · 02.05.2011

AW: Countdown zähler erstellen bzw. Design ändern.

das ist einfach ein mit Zahlen von 0-9 wo dann immer die Position verändert wird.

xxCyRiuSxx · 02.05.2011

AW: Countdown zähler erstellen bzw. Design ändern.

Das ist gut zu wissen, ich hab nach langem suchen jetzt doch was gefunden nur bin ich zu löd das Datum einzutragen ...

Code:

<div id="counter" class="counter">
        <ul class="countdown">
            <li><div class="countdown_num" id="countdown_day"></div><div>Days</div></li>
            <li><div class="countdown_num" id="countdown_hour"></div><div>Hours</div></li>
            <li><div class="countdown_num" id="countdown_min"></div><div>Minutes</div></li>
            <li><div class="countdown_num" id="countdown_sec"></div><div>Seconds</div></li>
        </ul>
    </div>
    <div id="expired" style="display:none;">
        The deadline has passed.
    </div>
<script type="text/javascript">
    /*
        Countdown Timer
        Based on the "Count down until any date script" - By JavaScript Kit (www.javascriptkit.com)
        Author: (c) 2009 Elbert Bautista
        URL: http://www.egTheBlog.com
        Licence : Open Source MIT Licence

    */
    
    var current="Expired"
    var montharray=new Array("Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec")

    function countdown(yr,m,d){
        theyear=yr;themonth=m;theday=d
        var today=new Date()
        var todayy=today.getYear()
        if (todayy < 1000)
        todayy+=1900
        var todaym=today.getMonth()
        var todayd=today.getDate()
        var todayh=today.getHours()
        var todaymin=today.getMinutes()
        var todaysec=today.getSeconds()
        var todaystring=montharray[todaym]+" "+todayd+", "+todayy+" "+todayh+":"+todaymin+":"+todaysec
        futurestring=montharray[m-1]+" "+d+", "+yr
        dd=Date.parse(futurestring)-Date.parse(todaystring)
        dday=Math.floor(dd/(60*60*1000*24)*1)
        dhour=Math.floor((dd%(60*60*1000*24))/(60*60*1000)*1)
        dmin=Math.floor(((dd%(60*60*1000*24))%(60*60*1000))/(60*1000)*1)
        dsec=Math.floor((((dd%(60*60*1000*24))%(60*60*1000))%(60*1000))/1000*1)
        if(dday==0&&dhour==0&&dmin==0&&dsec==1){
            document.getElementById('counter').style.display='none';
            document.getElementById('expired').style.display='block';
            return
        }
        else{
            document.getElementById('countdown_day').innerHTML=dday;
            document.getElementById('countdown_hour').innerHTML=dhour;
            document.getElementById('countdown_min').innerHTML=dmin;
            document.getElementById('countdown_sec').innerHTML=dsec;
            setTimeout("countdown(theyear,themonth,theday)",1000)
        }
    }

    var deadline=new Date();
    deadline.setDate(deadline.getDate()+5);
    var deadlineYear = deadline.getYear();
    if (deadlineYear < 1000)
    deadlineYear+=1900
    //enter the count down date using the format year/month/day
    countdown(deadlineYear, deadline.getMonth()+1, deadline.getDate());
    </script>

Bitte um hilfe

Mein Datun ist der 30/04/2012

fakerer · 02.05.2011

AW: Countdown zähler erstellen bzw. Design ändern.

hier ist der aufruf der funktion

countdown(deadlineYear, deadline.getMonth()+1, deadline.getDate());
entspricht zB
countdown(2011, 05, 02);

xxCyRiuSxx · 02.05.2011

AW: Countdown zähler erstellen bzw. Design ändern.

countdown(deadlineYear, deadline.getMonth()+1, deadline.getDate());

also so ja

2011/04/30(deadlineYear, deadline.getMonth()+1, deadline.getDate());

upps sry wenn dann so oder

countdown(2012Year, 04.getMonth()+1, 30.getDate());

neh das wars auch net moar kann doch net sein

ok habs denke ich das datum muss in die letzte klammer wenn des so stimmt

edit die 4. Datum war richtig nur hab ich trotzdem jetzzt kein counter iwas stimmt da noch nicht

cebito · 02.05.2011

AW: Countdown zähler erstellen bzw. Design ändern.

Irgendwie rumprobieren und dann fluchen :uhm: Schau dir doch mal an, was die function erwartet, nämlich function countdown(yr,m,d) Jahr, Monat und Tag, mit denen die function dann weiterarbeitet!

Du musst dein Datum also so übergeben

HTML:

countdown(2012, 04, 30);

get und set lass ich hier lieber mal außen vor.

xxCyRiuSxx · 02.05.2011

AW: Countdown zähler erstellen bzw. Design ändern.

cebito schrieb:
Irgendwie rumprobieren und dann fluchen :uhm: Schau dir doch mal an, was die function erwartet, nämlich function countdown(yr,m,d) Jahr, Monat und Tag, mit denen die function dann weiterarbeitet!

Du musst dein Datum also so übergeben

HTML:

countdown(2012, 04, 30);

get und set lass ich hier lieber mal außen vor.

Also kann ich dann Year etc einfach überschreiebn?
countdown(deadlineYear, deadline.getMonth()+1, deadline.getDate());

countdown(2012, 04, 30());

hmm sieht aber iwie net richtig uas

neh wie gesagt das war auhc falsch ... ich bekomme die kriese kann mir vllt einer von euch pros den geänderten richtigen code posten

cebito · 02.05.2011

AW: Countdown zähler erstellen bzw. Design ändern.

xxCyRiuSxx schrieb:
Also kann ich dann Year etc einfach überschreiebn? .......countdown(2012, 04, 30());
hmm sieht aber iwie net richtig uas

Nein, am besten multiplizierst du alles in einer Schleife so lange mit 1, bis es von selbst rafft, das es gefälligst ein numerischer Wert zu sein hat :rolleyes:

Wo bitteschön, ist bei mir hinter der 30 eine extra öffnende und schließende Klammer? Was ist an copy&paste so schwierig? Ich habe keine Lust, jemandem die Methoden von date() zu erklären, der nicht mal fehlerfrei abschreiben kann :uhm:

xxCyRiuSxx schrieb:
neh wie gesagt das war auhc falsch ... ich bekomme die kriese kann mir vllt einer von euch pros den geänderten richtigen code posten

Du hast ihn schon :hmpf:

xxCyRiuSxx · 02.05.2011

AW: Countdown zähler erstellen bzw. Design ändern.

cebito schrieb:
Nein, am besten multiplizierst du alles in einer Schleife so lange mit 1, bis es von selbst rafft, das es gefälligst ein numerischer Wert zu sein hat Wo bitteschön, ist bei mir hinter der 30 eine extra öffnende und schließende Klammer? Was ist an copy&paste so schwierig? Ich habe keine Lust, jemandem die Methoden von date() zu erklären, der nicht mal fehlerfrei abschreiben kann :uhm:

hab ja net abgeschrieben, hab das versuch in meinem code zu ändern

edt
deadlineYear+=1900
countdown(2012, 04, 30);
countdown(deadlineYear, deadline.getMonth()+1, deadline.getDate());
so das ist jetzt mein neuer code

aber auf meiner seite läut immer noch kein countdown, die 4 schaltfläcgen dafür sind immer noch leer

cebito · 02.05.2011

AW: Countdown zähler erstellen bzw. Design ändern.

Man merkt, du weißt nicht, was du machst. Diesen ganzen Teil

HTML:

   var deadline=new Date();     
deadline.setDate(deadline.getDate()+5);     
var deadlineYear = deadline.getYear();     
if (deadlineYear < 1000)     
deadlineYear+=1900     
//enter the count down date using the format year/month/day     
countdown(deadlineYear, deadline.getMonth()+1, deadline.getDate());

kannst du komplett löschen, da ich wie gesagt keine Lust habe, dir das zu erklären, und dafür einfach nur diese eine Zeile, die ich oben gepostet habe an dieser Stelle einfügen.

xxCyRiuSxx · 02.05.2011

AW: Countdown zähler erstellen bzw. Design ändern.

Ok danke dir für deine Mühr und Nerven ^^

Code:

setTimeout("countdown(theyear,themonth,theday)",1000)
        }
    }

    countdown(2012, 04, 30);
    
    </script>

so sieht des jetzt aus nur mein zählerläuft immer noch nicht

cebito · 02.05.2011

AW: Countdown zähler erstellen bzw. Design ändern.

Dann poste bitte den kompletten Quellcode deiner Seite! Oder stell deinen Versuch online und poste einen Link!

xxCyRiuSxx · 03.05.2011

AW: Countdown zähler erstellen bzw. Design ändern.

Hier der CSS

Code:

.counter{
    width: 610px;
}
.counter ul.countdown{
    list-style-type: none;
    color: white;
    font-weight: bold;
    text-align: center;
}
.counter ul.countdown li{
    float: left;
    background: url(digit.png) no-repeat;
    height:110px;
    width: 105px;
    padding-top: 15px;
}
.counter ul.countdown li div{
    font-size: 15px;
}
.counter ul.countdown li div.countdown_num{
    font-size: 48px;
}
.counter ul.countdown li.no_countdown{
    padding-top:4px;
    background:transparent;
    height:110px;
    width:180px;
}
</style>

Hier das komplette Script

Code:

<div id="counter" class="counter">
        <ul class="countdown">
            <li><div class="countdown_num" id="countdown_day"></div><div>Days</div></li>
            <li><div class="countdown_num" id="countdown_hour"></div><div>Hours</div></li>
            <li><div class="countdown_num" id="countdown_min"></div><div>Minutes</div></li>
            <li><div class="countdown_num" id="countdown_sec"></div><div>Seconds</div></li>
        </ul>
    </div>
    <div id="expired" style="display:none;">
        The deadline has passed.
    </div>
<script type="text/javascript">   
    var current="Expired"
    var montharray=new Array("Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec")

    function countdown(yr,m,d){
        theyear=yr;themonth=m;theday=d
        var today=new Date()
        var todayy=today.getYear()
        if (todayy < 1000)
        todayy+=1900
        var todaym=today.getMonth()
        var todayd=today.getDate()
        var todayh=today.getHours()
        var todaymin=today.getMinutes()
        var todaysec=today.getSeconds()
        var todaystring=montharray[todaym]+" "+todayd+", "+todayy+" "+todayh+":"+todaymin+":"+todaysec
        futurestring=montharray[m-1]+" "+d+", "+yr
        dd=Date.parse(futurestring)-Date.parse(todaystring)
        dday=Math.floor(dd/(60*60*1000*24)*1)
        dhour=Math.floor((dd%(60*60*1000*24))/(60*60*1000)*1)
        dmin=Math.floor(((dd%(60*60*1000*24))%(60*60*1000))/(60*1000)*1)
        dsec=Math.floor((((dd%(60*60*1000*24))%(60*60*1000))%(60*1000))/1000*1)
        if(dday==0&&dhour==0&&dmin==0&&dsec==1){
            document.getElementById('counter').style.display='none';
            document.getElementById('expired').style.display='block';
            return
        }
        else{
            document.getElementById('countdown_day').innerHTML=dday;
            document.getElementById('countdown_hour').innerHTML=dhour;
            document.getElementById('countdown_min').innerHTML=dmin;
            document.getElementById('countdown_sec').innerHTML=dsec;
            setTimeout("countdown(theyear,themonth,theday)",1000)
        }
    }

    var deadline=new Date();
    deadline.setDate(deadline.getDate()+5);
    var deadlineYear = deadline.getYear();
    if (deadlineYear < 1000)
    deadlineYear+=1900
    //enter the count down date using the format year/month/day
    countdown(deadlineYear, deadline.getMonth()+1, deadline.getDate());
    </script>

Und hier die png Datei

Mein HTML Code:

Code:

<script language="JavaScript">
function MM_swapImgRestore() { //v3.0
  var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_preloadImages() { //v3.0
  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_findObj(n, d) { //v4.01
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
  var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
   if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
 </script>
 <script type="text/javascript">
    
    var current="Expired"
    var montharray=new Array("Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec")

    function countdown(yr,m,d){
        theyear=yr;themonth=m;theday=d
        var today=new Date()
        var todayy=today.getYear()
        if (todayy < 1000)
        todayy+=1900
        var todaym=today.getMonth()
        var todayd=today.getDate()
        var todayh=today.getHours()
        var todaymin=today.getMinutes()
        var todaysec=today.getSeconds()
        var todaystring=montharray[todaym]+" "+todayd+", "+todayy+" "+todayh+":"+todaymin+":"+todaysec
        futurestring=montharray[m-1]+" "+d+", "+yr
        dd=Date.parse(futurestring)-Date.parse(todaystring)
        dday=Math.floor(dd/(60*60*1000*24)*1)
        dhour=Math.floor((dd%(60*60*1000*24))/(60*60*1000)*1)
        dmin=Math.floor(((dd%(60*60*1000*24))%(60*60*1000))/(60*1000)*1)
        dsec=Math.floor((((dd%(60*60*1000*24))%(60*60*1000))%(60*1000))/1000*1)
        if(dday==0&&dhour==0&&dmin==0&&dsec==1){
            document.getElementById('counter').style.display='none';
            document.getElementById('expired').style.display='block';
            return
        }
        else{
            document.getElementById('countdown_day').innerHTML=dday;
            document.getElementById('countdown_hour').innerHTML=dhour;
            document.getElementById('countdown_min').innerHTML=dmin;
            document.getElementById('countdown_sec').innerHTML=dsec;
            setTimeout("countdown(theyear,themonth,theday)",1000)
        }
    }

    countdown(2012, 04, 30);
    
    </script>
</head>
<div id="header">
    <div id="logo">
   <img src="../Logos/HIFI_ZV.PNG" alt="Logo" width="85%" height="100%" />
</div>
 <div id="navigation">
  <a href="Index.html" target="_self" onmouseover="MM_swapImage('Home','','../Buttons/Home_hover.png',1)" onmouseout="MM_swapImgRestore()"><img src="../Buttons/Home.png" alt="Home" width="10%" height="100%" border="0" id="Home" /></a>
  <a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Produkte','','../Buttons/Produkte_hover.png',1)"><img src="../Buttons/Produkte.png" alt="Produkte" width="10%" height="100%" border="0" id="Produkte" /></a> 
  <a href="Service.html" target="_self" onmouseover="MM_swapImage('Service','','../Buttons/Service_hover.png',1)" onmouseout="MM_swapImgRestore()"><img src="../Buttons/Service.png" alt="Service" width="10%" height="100%" border="0" id="Service" /></a>
  <a href="Kontakt.html" target="_self" onmouseover="MM_swapImage('Kontakt','','../Buttons/Kontakt_hover.png',1)" onmouseout="MM_swapImgRestore()"><img src="../Buttons/Kontakt_hover.png" alt="Kontakt" width="10%" height="100%" border="0" id="Kontakt" /></a> 
  <a href="Impressum.html" target="_self" onmouseover="MM_swapImage('Impressum','','../Buttons/Impressum_hover.png',1)" onmouseout="MM_swapImgRestore()"><img src="../Buttons/Impressum.png" alt="Impressum" width="10%" height="100%" border="0" id="Impressum" /></a>
  <a href="Ueber_uns.html" target="_self" onmouseover="MM_swapImage('Über_uns','','../Buttons/Über_uns_hover.png',1)" onmouseout="MM_swapImgRestore()"><img src="../Buttons/Über_uns.png" alt="Über_uns" width="10%" height="100%" border="0" id="Über_uns" /></a>
  <a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Ehrungen','','../Buttons/Ehrungen_hover.png',1)"><img src="../Buttons/Ehrungen.png" alt="Ehrungen" width="10%" height="100%" border="0" id="Ehrungen" /></a></div>

<body>
<div id="main_Kontakt">
<div id="Kontakt_Seite">
Wir sind unter folgender Rufnummer erreichbar 
<p class="Telefon">0202405877</p>
Oder schreiben Sie uns eine Email, wir werden Ihre Anfrage so schnell wie möglich bearbeiten!0
</div>
<div id="Email_Button">
<a href="" target="_new"><img src="../Buttons/Email.png" width="10%" alt="Email_Bild" border="0" /></a> 
</div>
<div id="Oeffnungszeiten">
<p class="Oeffnungszeiten_überschrift"> Unsere Öffnungszeiten sind:</p>
<table style="background-image:url(../Hintergrund/Grau_transparent.png); margin:0 auto"  class="Oeffnungszeiten_Tabelle"  width="50%" border="0" cellspacing="8" cellpadding="1">
<br />
  <tr>
    <td>Montags</td>
    <td>10:00 - 13:00</td>
    <td>15:00 - 18:30</td>
  </tr>
  <tr>
    <td>Dienstags</td>
    <td>10:00 - 13:00</td>
    <td>15:00 - 18:30</td>
  </tr>
  <tr>
    <td>Mittwochs</td>
    <td>10:00 - 13:00</td>
    <td class="Tabellen_text">Nur Vormittags</td>
  </tr>
  <tr>
    <td>Donnerstags</td>
    <td>10:00 - 13:00</td>
    <td>15:00 - 18:30</td>
  </tr>
  <tr>
    <td>Freitags</td>
    <td>10:00 - 13:00</td>
    <td>15:00 - 18:30</td>
  </tr>
  <tr>
    <td>Samstags</td>
    <td>10:00 - 14:00</td>
    <td class="Tabellen_text">Nur Vormittags</td>
  </tr>
</table>
</div>
<div id="counter" class="counter">
        <ul class="countdown">
            <li><div class="countdown_num" id="countdown_day"></div><div>Tage</div></li>
            <li><div class="countdown_num" id="countdown_hour"></div><div>Stunden</div></li>
            <li><div class="countdown_num" id="countdown_min"></div><div>Minuten</div></li>
            <li><div class="countdown_num" id="countdown_sec"></div><div>Sekunden</div></li>
        </ul>
    </div>
    <div id="expired" style="display:none;">
        The deadline has passed.
    </div>
</div>
</body>
</html>

Chriss1987 · 03.05.2011

AW: Countdown zähler erstellen bzw. Design ändern.

Hi,

hast du mal versucht, die Seite zu debuggen? Gibt es Einträge in der Fehlerkonsole (im FireFox)? Welchen Browser benutzt du?

Wenn du in die Fehlerkonsole schaust, wird dir auffallen, dass er in Zeile 53 das Script abbricht, weil 'document.getElementById('countdown_day')' null ist.

Das liegt daran, das beim Aufruf von 'countdown(2012, 04, 30);' noch nicht die gesammte Seite geladen ist und demnach auch kein Element mit der ID 'countdown_day' gefunden wird. Umgehen kannst du das, indem du die Funktion im OnLoad-Event des Bodys aufrufst:

HTML:

...<body onload="countdown(2012, 04, 30);">...

und Zeile 61 rauschmeißen.

Außerdem solltest du mal deinen HTML-Code überprüfen, vor dem BODY-Tag hast du schon DIV's...

HTH
Schöne Grüße aus dem Sauerland!
Chriss

Edit: Sorry, hatte vergessen, dass Abschreiben nicht so deine Stärke ist, hier dein HTML-Code zum C&P:

HTML:

<script language="JavaScript">
function MM_swapImgRestore() { //v3.0
  var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_preloadImages() { //v3.0
  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_findObj(n, d) { //v4.01
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
  var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
   if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
 </script>
 <script type="text/javascript">
    
    var current="Expired"
    var montharray=new Array("Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec")

    function countdown(yr,m,d){
        theyear=yr;themonth=m;theday=d
        var today=new Date()
        var todayy=today.getYear()
        if (todayy < 1000)
        todayy+=1900
        var todaym=today.getMonth()
        var todayd=today.getDate()
        var todayh=today.getHours()
        var todaymin=today.getMinutes()
        var todaysec=today.getSeconds()
        var todaystring=montharray[todaym]+" "+todayd+", "+todayy+" "+todayh+":"+todaymin+":"+todaysec
        futurestring=montharray[m-1]+" "+d+", "+yr
        dd=Date.parse(futurestring)-Date.parse(todaystring)
        dday=Math.floor(dd/(60*60*1000*24)*1)
        dhour=Math.floor((dd%(60*60*1000*24))/(60*60*1000)*1)
        dmin=Math.floor(((dd%(60*60*1000*24))%(60*60*1000))/(60*1000)*1)
        dsec=Math.floor((((dd%(60*60*1000*24))%(60*60*1000))%(60*1000))/1000*1)
        if(dday==0&&dhour==0&&dmin==0&&dsec==1){
            document.getElementById('counter').style.display='none';
            document.getElementById('expired').style.display='block';
            return
        }
        else{
            document.getElementById('countdown_day').innerHTML=dday;
            document.getElementById('countdown_hour').innerHTML=dhour;
            document.getElementById('countdown_min').innerHTML=dmin;
            document.getElementById('countdown_sec').innerHTML=dsec;
            setTimeout("countdown(theyear,themonth,theday)",1000)
        }
    }
    
    </script>
</head>
<div id="header">
    <div id="logo">
   <img src="../Logos/HIFI_ZV.PNG" alt="Logo" width="85%" height="100%" />
</div>
 <div id="navigation">
  <a href="Index.html" target="_self" onmouseover="MM_swapImage('Home','','../Buttons/Home_hover.png',1)" onmouseout="MM_swapImgRestore()"><img src="../Buttons/Home.png" alt="Home" width="10%" height="100%" border="0" id="Home" /></a>
  <a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Produkte','','../Buttons/Produkte_hover.png',1)"><img src="../Buttons/Produkte.png" alt="Produkte" width="10%" height="100%" border="0" id="Produkte" /></a> 
  <a href="Service.html" target="_self" onmouseover="MM_swapImage('Service','','../Buttons/Service_hover.png',1)" onmouseout="MM_swapImgRestore()"><img src="../Buttons/Service.png" alt="Service" width="10%" height="100%" border="0" id="Service" /></a>
  <a href="Kontakt.html" target="_self" onmouseover="MM_swapImage('Kontakt','','../Buttons/Kontakt_hover.png',1)" onmouseout="MM_swapImgRestore()"><img src="../Buttons/Kontakt_hover.png" alt="Kontakt" width="10%" height="100%" border="0" id="Kontakt" /></a> 
  <a href="Impressum.html" target="_self" onmouseover="MM_swapImage('Impressum','','../Buttons/Impressum_hover.png',1)" onmouseout="MM_swapImgRestore()"><img src="../Buttons/Impressum.png" alt="Impressum" width="10%" height="100%" border="0" id="Impressum" /></a>
  <a href="Ueber_uns.html" target="_self" onmouseover="MM_swapImage('Über_uns','','../Buttons/Über_uns_hover.png',1)" onmouseout="MM_swapImgRestore()"><img src="../Buttons/Über_uns.png" alt="Über_uns" width="10%" height="100%" border="0" id="Über_uns" /></a>
  <a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Ehrungen','','../Buttons/Ehrungen_hover.png',1)"><img src="../Buttons/Ehrungen.png" alt="Ehrungen" width="10%" height="100%" border="0" id="Ehrungen" /></a></div>

<body onload="countdown(2012, 04, 30);">
<div id="main_Kontakt">
<div id="Kontakt_Seite">
Wir sind unter folgender Rufnummer erreichbar 
<p class="Telefon">0202405877</p>
Oder schreiben Sie uns eine Email, wir werden Ihre Anfrage so schnell wie möglich bearbeiten!0
</div>
<div id="Email_Button">
<a href="" target="_new"><img src="../Buttons/Email.png" width="10%" alt="Email_Bild" border="0" /></a> 
</div>
<div id="Oeffnungszeiten">
<p class="Oeffnungszeiten_überschrift"> Unsere Öffnungszeiten sind:</p>
<table style="background-image:url(../Hintergrund/Grau_transparent.png); margin:0 auto"  class="Oeffnungszeiten_Tabelle"  width="50%" border="0" cellspacing="8" cellpadding="1">
<br />
  <tr>
    <td>Montags</td>
    <td>10:00 - 13:00</td>
    <td>15:00 - 18:30</td>
  </tr>
  <tr>
    <td>Dienstags</td>
    <td>10:00 - 13:00</td>
    <td>15:00 - 18:30</td>
  </tr>
  <tr>
    <td>Mittwochs</td>
    <td>10:00 - 13:00</td>
    <td class="Tabellen_text">Nur Vormittags</td>
  </tr>
  <tr>
    <td>Donnerstags</td>
    <td>10:00 - 13:00</td>
    <td>15:00 - 18:30</td>
  </tr>
  <tr>
    <td>Freitags</td>
    <td>10:00 - 13:00</td>
    <td>15:00 - 18:30</td>
  </tr>
  <tr>
    <td>Samstags</td>
    <td>10:00 - 14:00</td>
    <td class="Tabellen_text">Nur Vormittags</td>
  </tr>
</table>
</div>
<div id="counter" class="counter">
        <ul class="countdown">
            <li><div class="countdown_num" id="countdown_day"></div><div>Tage</div></li>
            <li><div class="countdown_num" id="countdown_hour"></div><div>Stunden</div></li>
            <li><div class="countdown_num" id="countdown_min"></div><div>Minuten</div></li>
            <li><div class="countdown_num" id="countdown_sec"></div><div>Sekunden</div></li>
        </ul>
    </div>
    <div id="expired" style="display:none;">
        The deadline has passed.
    </div>
</div>
</body>
</html>

xxCyRiuSxx · 03.05.2011

AW: Countdown zähler erstellen bzw. Design ändern.

Yes baby du bist mein persönlicher Held, jetzt klappt des so wie es soll. Ich bin dir echt dankbar.