[JAVASCRIPT] Script per la creazione di un cronometro

[JAVASCRIPT] Script per la creazione di un cronometro

  luglio 21, 2014    portaletecnologico

---

Script per la creazione di un cronometro con i pulsanti Start/Continua, Pausa, Reset. Lo script è valido e testato per qualsiasi piattaforma e pagina web. L'immagine sotto è un esempio, una volta istallato il codice, funzionerà regolarmente. 

Clicca qui per selezionare il codice
<span style="font-family: verdana;"></span><span style="font-family: verdana;"> </span> <form name="time"> <div align="center"> <center> <table border="2" bordercolor="#ff0000"><tbody> <tr><td colspan="3"><div align="center"> <center> <input maxlength="80" name="watch" size="15" type="text" value="0'0"0 0" /></center> </div> </td></tr> <tr align="center"><td><input onclick="running = true; start()" type="button" value="Start/Continua" /></td> <td><input onclick="running = false" type="button" value="Pausa" /></td><td><input onclick="restart()" type="button" value="Reset" /></td></tr> </tbody></table> <span style="font-family: verdana;"></span></center> </div> </form> <span style="font-family: verdana;"></span> <script> <!-- var firstTime = true var a = 0 var b = 0 var c = 0 var d = 0 var running = false function start() { if (firstTime == true){firstTime = false; started= new Date()} if (running == false){return} var now = new Date() var a= Math.floor((now.getTime() - started.getTime()) / 10) if (a >= 100) {a-=100; started= new Date(); b++} if (b >= 60) {b = 0; c++} if (c >= 60) {c = 0;d++} document.time.watch.value = d + "'" + c + "\"" + b + " " + a var timeID = setTimeout("start()",0) } function restart() { if (running == true){return} document.time.watch.value = "0'0\"0 0" a = 0 b = 0 c = 0 d = 0 started = new Date() firstTime = true } //--> </script>

Per modificare la dimensione e il colore del bordo, andiamo nella stringa (all'inizio del codice)

<center><table border="2" bordercolor="#ff0000"><tbody>

Modifichiamo gli attributi border (dimensioni del bordo) e bordercolor (colore del bordo). Per esempio se vogliamo un bordo di dimensione 3  e  colore giallo la stringa sarà:

<center><table border="3" bordercolor="#ffff00"><tbody>

Una tabella dei colori in esadecimale, si può trovare qua.

Per inserire il codice in un blog di Blogger, bisogna inserirlo in un gadget HTML/JavaScript.
Si va sulla bacheca da www.blogger.com,
-Impostazioni
-Design
-Aggiungi un gadget
-Scegliamo HTML/JavaScript
-Copiaincolliamo il codice
-Salva

Puntiamo il mouse sul gadget appena creato e trasciniamolo nel punto dove più lo preferiamo, salviamo tutto cliccando su Salva in alto a destra della pagina.