Menù

Demo

  • aggiornato il 11/03/2025 14:49:34

Top 5

Orologio digitale Javascript

In questo esempio ho voluto simulare l'effetto lampeggiante della mia fastidiosissima radiosveglia.

Di seguito il codice Javascript commentato

function clock() {
       // creiamo l'oggetto 
       var data = new Date();
       // recupero l'ora corrente 
       var ora = data.getHours();
       // recupero i minuti attuali 
       var min = data.getMinutes();
       // recupero i secondi attuali 
       var sec = data.getSeconds();
       // formatto i minuti
       if (min < 10) {min = "0" + min}
       // in base ai secondi imposto il segno 
       var sign = sec % 2 == 1 ? ":" : " ";
       // preparo l'output 
       var output = ora + sign + min;
       // scrivo l'ora nell'elemento 
       document.getElementById("orologio").innerHTML = output;
       // richiamo la funione tra un secondo 
       setTimeout("clock()", 1000);
}
clock();

Altrettanto importante è il codice Css e soprattutto nel mio esempio il font che ho usato evita fastidiosi scatti.

#orologio {
    width:80px;
    text-align: center;
    background-color: #000;
    color:yellow;
    font-weight: bold;
    font-family: "Courier New";
    padding:4px;
    font-size: 1.1em;
    border: 3px solid #2D69AF;
}


criric

Mi sono appassionato di programmazione web a 34 anni, un pò tardi, da allora però non perdo mai occasione per imparare qualcosa di nuovo in questi campi.

Javascript - Html - Css - Php - Mysql

Inserisci un commento

Codice antispam

Categorie

Comunicazioni

Puoi utilizzare questo modulo per qualsiati tipo di segnalazione.

Codice antispam

 

I dati di questo modulo non verranno pubblicati.