Insomma un countdown può essere utilizzato per un'infinità di scopi ed anche se non è indispensabile può fare piacere vederlo in certe circostanze; sicuramente vi starete chiedendo come crearne uno dato che non siete esperti di alcun linguaggio di programmazione ma non ci vuole neanche molto a realizzarlo da zero dato che è tra le prime cose che si imparano studiando Javascript da qualche corso online o qualche manuale cartaceo, ad ogni modo ho pensato di semplificarvi le cose mettendovi un codice già pronto per essere usato.
Qui sotto troverete il codice javascript per creare un countdown che calcola le ore, i minuti ed i secondi rimanenti; copiatelo ed incollatelo in un'area HTML del vostro sito o blog così com'è senza aggiungere spazi o andare a capo:
<h2>
Countdown Anno 2015</h2>
<hr />
<script language="JavaScript">
now = new Date ();
y2k = new Date ("Jan 01 2015 00:00:00") ;
seconds = (y2k - now) / 1000 ;
seconds=Math.round (seconds);
document.write ("<b>Secondi rimanenti:</b> " + seconds) ;
minutes=seconds / 60;
minutes=Math.round (minutes)
document.write ("<p><b>Minuti rimanenti:</b> " + minutes) ;
hours=minutes / 60;
hours=Math.round (hours)
document.write ("<p><b>Ore rimanenti:</b> " + hours) ;
</script>
Personalizzazioni
Ovviamente il codice di base è quello riportato sopra ma questo non significa che dobbiate utilizzarlo così com'è e soprattutto solo per l'anno 2015. In rosso sono evidenziate le scritte e gli elementi che possono essere modificati.Jan 01 2015 00:00:00 = significa che il countdown prenderà come punto di riferimento lo scoccare della mezzanotte e l'inizio dell'anno nuovo 1 Genniao 2015; quando un giorno questa data sarà superata il countdown continuerà a funzionare ugualmente ma vi ritroverete numeri negativi che conteggiano i secondi, i minuti e le ore che sono passate dal giorno assegnato. Per la modifica della data dovete inserire prima il mese con le tre lettere iniziali in inglese, poi il giorno, l'anno ed infine ore, minuti e secondi.
seconds=Math.round (seconds); = è una istruzione che arrotonda il numero dei secondi rimanenti al giorno assegnato, se rimuovete questa riga i secondi diventeranno un numero decimale con la virgola; certamente una soluzione molto più precisa in termini numerici ma più brutta e meno immediata esteticamente. L'istruzione di questo caso esegue la funzione Math alla variabile seconds, come potete vedere dal codice precedente è stato fatto la stessa operazione anche per i minuti e le ore.
Il colore, il font e la dimensione dei caratteri può essere cambiata utilizzando i comuni codici HTML racchiudendo le parole in rosso. Essendo un codice semplice mi sono limitato ad inserire solamente il grassetto ma voi potete andare anche oltre con le personalizzazioni.
L'unica pecca di questo script è che il variare del tempo è visibile solo aggiornando la pagina.
Su un altro articolo ho parlato di countdown online molto più belli e più colorati, alcuni dei quali si possono aggiungere come widget sul proprio sito o blog.
