+ Rispondi alla Discussione
Risultati da 1 a 6 di 6

countdown ripetuto piu' volte nella stessa pagina

Ultimo Messaggio di flaviors200 il:
  1. #1
    User Attivo
    Data Registrazione
    May 2006
    Località
    London
    Messaggi
    1,156

    countdown ripetuto piu' volte nella stessa pagina

    Salve a tutti

    dovrei inserire un countdown in una pagina dove ho varie offerte.
    La scadenza sarà sempre la stessa

    Sto provando questo codice, ma me lo mostra solo nella prima offerta, come potrei fare per mostrarlo in tutte?

    Codice:
    <script>
    // Set the date we're counting down to
    var countDownDate = new Date("May 24, 2019 20:00:00").getTime();
    
    // Update the count down every 1 second
    var x = setInterval(function() {
    
      // Get todays date and time
      var now = new Date().getTime();
    
      // Find the distance between now and the count down date
      var distance = countDownDate - now;
    
      // Time calculations for days, hours, minutes and seconds
      var days = Math.floor(distance / (1000 * 60 * 60 * 24));
      var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
      var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
      var seconds = Math.floor((distance % (1000 * 60)) / 1000);
    
      // Display the result in the element with id="demo"
      document.getElementById("demo").innerHTML = days + " Giorni " + hours + " ore "
      + minutes + " minuti " + seconds + " secondi ";
    
      // If the count down is finished, write some text 
      if (distance < 0) {
        clearInterval(x);
        document.getElementById("demo").innerHTML = "Promo Scaduta!";
      }
    }, 1000);
    </script>
    Grazie

  2. #2
    Utente Premium
    Data Registrazione
    Nov 2018
    Località
    Ragusa
    Messaggi
    183
    Aggiungi flaviors200 su Google+ Aggiungi flaviors200 su Facebook Aggiungi flaviors200 su Linkedin
    Ciao,

    devi utilizzare una classe anzichè un id, per richiamarla in javascript è necessaria la funzione getElementByClassName.


    Codice HTML:
    <div class="promo"></div>
    <div class="promo"></div>
    <div class="promo"></div>
    <div class="promo"></div>
    
    <script>
    // Set the date we're counting down to
    
    var countDownDate = new Date("May 30, 2019 11:26:00").getTime();
    
    // Update the count down every 1 second
    
    var x = setInterval(function() {
        
        // Get todays date and time
        
        var now = new Date().getTime();
        
        // Find the distance between now and the count down date
        
        var distance = countDownDate - now;
        
        // Time calculations for days, hours, minutes and seconds
        
        var days = Math.floor(distance / (1000 * 60 * 60 * 24));
        var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
        var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
        var seconds = Math.floor((distance % (1000 * 60)) / 1000);
        
        // Display the result in the element with class="promo"    
        
        var promo = document.getElementsByClassName("promo");
        
        for(var i = 0; i < promo.length; i++)
        {
            promo[i].innerHTML = days + " Giorni " + hours + " ore " + 
                                             minutes + " minuti " + seconds + " secondi ";
        }
        
        // If the count down is finished, write some text 
        
        if (distance < 0) {
            clearInterval(x);
            var promo = document.getElementsByClassName("promo");
    
            for(var i = 0; i < promo.length; i++)
            {
                promo[i].innerHTML = "Promo Scaduta!";
            }
        }
    }, 1000);
    
    </script>
    Sviluppo siti web dinamici e gestionali | Flaviobiscaldi.it

  3. #3
    User Attivo
    Data Registrazione
    May 2006
    Località
    London
    Messaggi
    1,156
    Ciao
    La soluzione è perfetta, grazie

    Solo una cosa, visto che devo metterlo in tante pagine, volendo creare un campo "data_scadenza" nel database, come potrei modificare questa stringa con php?

    Codice:
    var countDownDate = new Date("May 30, 2019 11:26:00").getTime();
    In questo caso creerei qualcosa tipo
    [code]
    var countDownDate = new Date("<?=$data_scadenza?>").getTime();
    [/code
    in modo da aggiornare solo il campo del database e visualizzarlo in automatico in tutte le offerte

    Vorrei evitare di creare il campo mese_scadenza, giorno_scadenza, anno_scadenza, orario_scadenza

    Grazie

  4. #4
    Utente Premium
    Data Registrazione
    Nov 2018
    Località
    Ragusa
    Messaggi
    183
    Aggiungi flaviors200 su Google+ Aggiungi flaviors200 su Facebook Aggiungi flaviors200 su Linkedin
    Utilizza sempre un solo campo per le date nel DB, all'occorrenza ti formatti la data come ti pare.

    In PHP puoi usare strftime() per formattare una data, prende come parametri il formato e lo Unix timestamp, che sarebbe il numero di secondi trascorsi a partire dal 1 gen 1970. Questo valore te lo puoi ricavare tramite la funzione strtotime().

    Dunque per ottenere la data formattata devi usare prima strtotime per ottenere il numero di secondi da dare come parametro a strftime. Non dimenticarti di settare il tempo locale in italiano (utilizza setlocale()), altrimenti il mese ti verrrà stampato in english.

    Non ti posto la pappa bella e pronta, però ti ho dato indicazioni su cosa devi fare, non è affatto complicato

    Ti lascio i link alla documentazione delle 2 funzioni, se e quando mi attiveranno l'account premium, finalmente potrò postare i link senza doverli modificare

    php.net/manual/en/function.strftime.php

    php.net/manual/en/function.strtotime.php
    Sviluppo siti web dinamici e gestionali | Flaviobiscaldi.it

  5. #5
    User Attivo
    Data Registrazione
    May 2006
    Località
    London
    Messaggi
    1,156
    Ciao
    ho risolto creando un campo di testo dove cambio direttamente il valore "May 30, 2019 11:26:00" a mio piacere e poi lo richiamo totalmente
    Mi trovo bene

    Grazie

  6. #6
    Utente Premium
    Data Registrazione
    Nov 2018
    Località
    Ragusa
    Messaggi
    183
    Aggiungi flaviors200 su Google+ Aggiungi flaviors200 su Facebook Aggiungi flaviors200 su Linkedin
    Ciao,

    il problema di salvarlo in quel formato è che non puoi ordinarlo e non puoi utilizzarlo nelle espressioni con WHERE (Es. WHERE data >= AND data <=).

    Sarebbe opportuno tu lo salvassi come DATETIME e non VARCHAR o TEXT, a meno che non ti interessano eventuali elaborazioni.
    Sviluppo siti web dinamici e gestionali | Flaviobiscaldi.it

+ Rispondi alla Discussione

^ Permessi di Scrittura

  • Tu non puoi inviare nuove discussioni
  • Tu non puoi inviare risposte
  • Tu non puoi inviare allegati
  • Tu non puoi modificare i tuoi messaggi
  •  
  • Il codice BB è Attivato
  • Le faccine sono Attivato
  • Il codice [IMG] è Attivato
  • Il codice [VIDEO] è Attivato
  • Il codice HTML è Disattivato
  • Trackbacks Attivato
  • Pingback Attivato
  • Refback Attivato

SEO by vBSEO 3.6.0 PL2 ©2011, Crawlability, Inc.