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;
}