Revision: 56325
Initial Code
Initial URL
Initial Description
Initial Title
Initial Tags
Initial Language
at March 22, 2012 03:41 by pixelatorz
Initial Code
/************************************
HTML
************************************/
<div id="timer">
<h3>MIJN TIJD</h3>
<div id="minutes">
<div id="m1">0</div>
<div id="m2">0</div>
</div>
<div id="seconds">
<div id="s1">0</div>
<div id="s2">0</div>
</div>
<div id="hundredths">
<div id="h1">0</div>
<div id="h2">0</div>
<div id="h3">0</div>
</div>
</div>
/************************************
TIMER
************************************/
var startDate;
var intervalId = 0;
function startTimer(){
//datum om de vergelijking mee te maken
startDate = new Date();
intervalId = setInterval(setTimer, 11);
}
function stopTimer(){
clearInterval(intervalId);
}
function setTimer(){
//hier trekken we de start datum af van de huidige datum om het verschil te krijgen in miliseconden
var currentDate = new Date();
var difference = currentDate - startDate;
//console.log(difference);
//functie om de tijd terug te geven
formatTime(difference);
}
function formatTime(ms){
//nummers omzetten naar de leesbare getallen
var sec = Math.floor(ms/1000)
ms = ms % 1000
t = three(ms)
var min = Math.floor(sec/60)
sec = sec % 60
t = two(sec) + t
min = min % 60
t = two(min) + t
//console.log(t);
//in een array steken en die reversen om de juiste waarde op te halen
var timeArray = t.split("").reverse();
$("#m1").text(timeArray[6]);
$("#m2").text(timeArray[5]);
$("#s1").text(timeArray[4]);
$("#s2").text(timeArray[3]);
$("#h1").text(timeArray[2]);
$("#h2").text(timeArray[1]);
$("#h3").text(timeArray[0]);
}
//plaats een 0 indien de waarde korter dan 2 getallen
function two(x) {return ((x>9)?"":"0")+x}
function three(x) {return ((x>99)?"":"0")+((x>9)?"":"0")+x}
Initial URL
Initial Description
simple html + javascript timer.
Initial Title
javascript timer
Initial Tags
javascript
Initial Language
JavaScript