Giornata di codifica video...
codice:
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>CountDown</title>
<script type="text/javascript">
//Imposta intervallo temporale//
var begin = new Date(2012, 3, 16, 15, 18, 10);//(anno, mese(vanno da 0 a 11), giorno, ore, minuti, secondi) - 16/04/2012 15:18:10
var end = new Date(2012, 3, 16, 15, 18, 25);// stessa data, 15 secondi dopo - 16/04/2012 15:18:25
//Imposta intervallo temporale//
var storedEnd=new Date(end.valueOf());//clone per il riavvio
window.onload=function(){
showTimer();
}
function showTimer(){
var t=setInterval(function(){
end.setSeconds(end.getSeconds()-1);//decrementa di un secondo
var millisecondi=end.getTime()-begin.getTime()+1000; //differenza tra le due date + il secondo tolto nel rigo precedente (fa partire il timer da 03:00:00 invece di 02:59:59)
if(millisecondi>=0){
var totaleSecondi=millisecondi/1000;
var ore=Math.floor(totaleSecondi/60/60);
if(ore<10){ore='0'+ore}
totaleSecondi=totaleSecondi-(ore*60*60);
var minuti=Math.floor(totaleSecondi/60);
if(minuti<10){minuti='0'+minuti}
var secondi=totaleSecondi-(minuti*60);
if(secondi<10){secondi='0'+secondi}
document.getElementById('txt').innerHTML=ore+':'+minuti+':'+secondi;
if(millisecondi==0){
t=clearInterval(t);
document.getElementById('restart').style.display='block';
}
}
},1000);
}
function restart(){
document.getElementById('restart').style.display='none';
end=new Date(storedEnd.valueOf());
showTimer();
}
</script>
</head>
<body>
<div id="txt" style="font-size:24px; font-weight:bold;"></div>
<input type="button" value="Reimposta Countdown" style="display:none;" id="restart" onClick="restart();">
</body>
</html>
Per impostare a tre ore, setta la variabile end:
var end = new Date(2012, 3, 16, 18, 18, 10);