Un Countdown in Javascript

countdown-hands

The Final Countdown e non è la famosissima canzone, ma si tratta di un countdown in javascript, semplice ma veramente utile.

Il suo utilizzo è alquanto intuitivo, ma ne vedremo un breve esempio:

<div id=”getting-started”></div>
<script type=”text/javascript”>
$(“#getting-started”) .countdown(“2016/01/01″, function(event) {
$(this).html(event.strftime(‘%D <span class=”data”>days</span> %H:%M:%S’));
});
</script>

La prima cosa che ci serve è un contenitore dove mostrare il risultato che vogliamo ottenere (nel nostro caso #getting-started).

Il codice non fa altro che recuperare il contenitore e richiamare “countdown”, dove dovremo inserire come prima cosa la data (va bene nel formato americano Y-m-d H:i:s) e poi l’evento che ci consentirà di inserire all’interno il countdown nel formato desiderato (in questo caso mostra i giorni con uno span interno, le ore i minuti e i secondi).

Lo script funziona anche con bootstrap, può essere usato per i coupon o come countown, continuando a contare una volta finito il tempo.

E’ anche possibile controllare il countdown con i comandi di pausa e riprendi.

Le funzionalità sono quelle base e realizzarlo da zero non è complicato ma essendo già pronto leva un lavoro in più.

Leave a Reply

Your email address will not be published. Required fields are marked *