kostenloser Webspace werbefrei: lima-city


Countdown 2 mal auf einer Seite anzeigen

lima-cityForumDie eigene HomepageHTML, CSS & Javascript

  1. Autor dieses Themas

    ultimate-bravery

    ultimate-bravery hat kostenlosen Webspace.

    Hallo,
    ich habe einen Javascript Countdown, der eine bestimmte Anzahl von Sekunden runter zählt. Das funktioniert auch einwandfrei, wenn ich den Countdown einmal auf meiner Seite ausgebe. Ich möchte den Countdown allerdings an zwei Stellen auf meiner Seite ausgeben und das klappt nicht.

    Hier ist der Code für den Countdown:

    <script language="JavaScript"> 
    <!--     Countdown für das automatische Aktualisieren
            
    function countdown(zahl){ 
    if(zahl>1){  
         // über 1 Sekunde hinaus -> x Sekunden 
         document.getElementById('downloading').innerHTML=zahl+" Sekunden"; 
         count(zahl);             
    } 
    else if(zahl==1){  
         // 1 Sekunde 
         document.getElementById('downloading').innerHTML=zahl+" Sekunde"; 
         count(zahl);             
    } 
    else {  
         // Countdown abgelaufen, beliebige Handlung kann eingebaut werden 
          document.getElementById('downloading').innerHTML="0 Sekunden"; 
    } 
    } 
                 
    function count(countzahl){ 
         // gewünschte Handlung kann hier eingebaut werden 
        countzahl=countzahl-1; 
         setTimeout("countdown("+countzahl+");",1000);             
    } 
    count(<?php echo $rest ?>); 
    
    // --> 
    </script> 
    <?php
    $rest2 = $rest*1000;
    ?>
    <script type="text/javascript">
    function Neuladen () {
    window.location.href = "<?php echo $link ?>";
    }
    window.setTimeout ("Neuladen()", <?php echo $rest2 ?>);
    </script>


    Ausgegeben wird der Countdown so:

    <span id='downloading'>$rest Sekunden</span>


    Wenn ich also versuche, diesen Code zum Ausgeben zwei mal auf meine zu setzen, läuft nur der Countdown runter, der als erstes Ausgegeben wird. Bei der zweiten Ausgabe wird nur die Startzeit angezeigt. Sie läuft nicht runter. Woran liegt das?

    Hoffe ihr könnt mir helfen.
    Liebe Grüße

    Beitrag zuletzt geändert: 31.12.2012 12:24:09 von ultimate-bravery
  2. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

    lima-city: Gratis werbefreier Webspace für deine eigene Homepage

  3. l*********e

    Das funktioniert so nicht, weil du zwei Elementen die gleiche ID gegeben hast. Wie soll JavaScript jetzt wissen welche gemeint ist.
    Aber auch für ein solches Problem gibt es eine Lösung:

    <script language="JavaScript"> 
    <!--     Countdown für das automatische Aktualisieren
            
    function countdown(zahl){ 
    if(zahl>1){  
         // über 1 Sekunde hinaus -> x Sekunden 
         document.getElementById('downloading1').innerHTML=zahl+" Sekunden"; 
         document.getElementById('downloading2').innerHTML=zahl+" Sekunden";
         count(zahl);             
    } 
    else if(zahl==1){  
         // 1 Sekunde 
         document.getElementById('downloading1').innerHTML=zahl+" Sekunde"; 
         document.getElementById('downloading2').innerHTML=zahl+" Sekunde"; 
         count(zahl);             
    } 
    else {  
         // Countdown abgelaufen, beliebige Handlung kann eingebaut werden 
          document.getElementById('downloading1').innerHTML="0 Sekunden"; 
          document.getElementById('downloading'2).innerHTML="0 Sekunden";
    } 
    } 
                 
    function count(countzahl){ 
         // gewünschte Handlung kann hier eingebaut werden 
        countzahl=countzahl-1; 
         setTimeout("countdown("+countzahl+");",1000);             
    } 
    count(<?php echo $rest ?>); 
    
    // --> 
    </script> 
    <?php
    $rest2 = $rest*1000;
    ?>
    <script type="text/javascript">
    function Neuladen () {
    window.location.href = "<?php echo $link ?>";
    }
    window.setTimeout ("Neuladen()", <?php echo $rest2 ?>);
    </script>


    Oder eine kürzere Lösung:
    <script language="JavaScript"> 
    <!--     Countdown für das automatische Aktualisieren
            
    function AktualisiereCounter(text)
    {
          document.getElementById('downloading1').innerHTML = text;
          document.getElementById('downloading2').innerHTML = text;
    }
    
    function countdown(zahl){ 
    if(zahl>1){  
         // über 1 Sekunde hinaus -> x Sekunden 
         AktualisiereCounter(zahl+" Sekunden)"; 
         count(zahl);             
    } 
    else if(zahl==1){  
         // 1 Sekunde 
         AktualisiereCounter(zahl+" Sekunde"); 
         count(zahl);             
    } 
    else {  
         // Countdown abgelaufen, beliebige Handlung kann eingebaut werden 
           AktualisiereCounter("0 Sekunden"); 
    } 
    } 
                 
    function count(countzahl){ 
         // gewünschte Handlung kann hier eingebaut werden 
        countzahl=countzahl-1; 
         setTimeout("countdown("+countzahl+");",1000);             
    } 
    count(<?php echo $rest ?>); 
    
    // --> 
    </script> 
    <?php
    $rest2 = $rest*1000;
    ?>
    <script type="text/javascript">
    function Neuladen () {
    window.location.href = "<?php echo $link ?>";
    }
    window.setTimeout ("Neuladen()", <?php echo $rest2 ?>);
    </script>


    Jetzt musst du die Counter natürlich mit
    <span id='downloading1'>$rest Sekunden</span>
    und
    <span id='downloading2'>$rest Sekunden</span>
    einbinden
  4. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

    lima-city: Gratis werbefreier Webspace für deine eigene Homepage

Dir gefällt dieses Thema?

Über lima-city

Login zum Webhosting ohne Werbung!