Un semplice conto alla rovescia JavaScript

• Aprile 29, 2024

Volevo un semplice timer per il conto alla rovescia JavaScript che potessi inserire in una finestra del widget di Blogger o utilizzare nel contesto di una pagina Web. Inizialmente, supponevo di poter facilmente trovare esattamente quello che cercavo con una rapida ricerca sul web. Tuttavia, tutti i contatori che ho trovato erano molto più complicati di quello che stavo cercando. Non volevo fare il conto alla rovescia fino all'ultimo secondo, mi importavo solo dei giorni. Quindi, ho deciso di scrivere il mio.

Il seguente codice è configurato per contare i giorni fino (o da) all'8 agosto 2008. Poiché l'8 è un numero propizio nella cultura cinese, questo giorno è stato scelto per le cerimonie di apertura delle Olimpiadi estive del 2008 a Pechino.


var millisecs_per_day = 86400000
// imposta il tempo del conto alla rovescia in millisecondi
// inserisci il giorno desiderato come argomenti in Date.UTC
// nell'ordine:
// anno, mese (ricorda che gennaio è 0), giorno del mese, offset da GMT
// NOTA: stiamo utilizzando l'offset perché rappresenta la mezzanotte
// (inizio giornata) in un fuso orario specifico
var countdown_time = Date.UTC (2008,7,8, -8);
// ottieni l'ora corrente e converti in millisecondi
var now = new Date ();
var now_millisecs = now.valueOf ();

var day_cnt = Math.ceil ((countdown_time - now_millisecs) / 86400000)

// visualizza il numero di giorni rimasti (o da allora)
if (day_cnt> 1)
{
// più giorni alla fine
document.write (day_cnt + "days to go")
}
else if (day_cnt == 1)
{
// un giorno per andare
document.write (day_cnt + "day to go")
}
altrimenti if (day_cnt == 0)
{
// è oggi
document.write ("oggi")
}
altrimenti if (day_cnt == -1)
{
// un giorno fa
document.write (day_cnt + "day ago")
}
altro
{
// più giorni fa
document.write (day_cnt + "days ago")
}


Puoi scaricare questo codice o vederlo in azione qui. Per utilizzare questo codice nei tuoi progetti, copialo e incollalo nella tua pagina web (o in una finestra del widget HTML / JavaScript di Blogger, come mostrato nella figura sopra.) Cambia la data secondo le istruzioni nei commenti - se questo è confuso , potresti trovare utile il mio articolo su Introduzione alle date UTC.

Istruzioni Video: Realizzare Timer con Jquery e con la funzione setInterval # 2 (Aprile 2024).