Menu
i have a problem with create activity script for 4 element on DOM. I can't use JQuery, must be write in pure JavaScript - it's practice for school... 1. The counter what i'am done work good but in next step i must divide html site for 4 part and any part must have his counter... so it's logical that i must use obiective javascript and there is problem... 2. Any time when i try create 4 obiect the last, destroy another. 3. Generally does not work and I do not know why.
There is code:
<pre><!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" type="text/css" href="style.css">
<link href='http://fonts.googleapis.com/css?family=Montserrat' rel='stylesheet' type='text/css'>
<title>Example #6</title>
<script>
function T(div){
var millis = 0;
var sec = 0;
var stopTime=0;
var totalTime =0;
var temp = 0;
var startTime=0;
var work = false;
setStopTime = function(){
stopTime = (new Date()).getTime() + 3000;
}
function setValue(value) {
millis = Math.floor ( value % 1000 );
value = Math.floor( value / 1000 );
sec = Math.floor ( value % 60 );
value = Math.floor( value / 60 );
if( value < 10 ) { value="0" + value;
if( sec < 10 ) { sec = "0" + sec; }
else if( millis < 100 ) { millis = "00" + millis; }
}
document.getElementById(div).innerHTML = value + ":" + sec +"." + millis;
}
go2 = function() {
if ( work == true ) return;
work = true;
document.getElementById(div).style.backgroundColor="red";
var currentTime = (new Date()).getTime();
startTime = currentTime;
var counter = setInterval(function() {
if(currentTime >= stopTime){
document.getElementById(div).style.backgroundColor="";
clearInterval(counter);
totalTime+= stopTime - startTime;
work = false;
setValue(totalTime);
return;
}
temp = currentTime - startTime;
setValue(temp+totalTime);
currentTime = (new Date()).getTime();
}, 1);
}
addEventListener("mousemove", function() {setStopTime();go2();});
addEventListener("keydown", function() {setStopTime();go2();});
}
var obj1 = new T('obj1');
var obj2 = new T('obj2');
var obj3 = new T('obj3');
var obj4 = new T('obj4');
</script>
</head>
<body>
<div id="obj1"><p>counter1</p></div>
<div id="obj2"><p>counter2</p></div>
<div id="obj3"><p>counter3</p></div>
<div id="obj4"><p>counter4</p></div>
</body>
</html></pre>
672
asked Dec 06 '25 16:12
go2 and setStopTime must be local.
var setStopTime = function(){...
var go2 = function() {
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
