<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" name="viewport" content="width=device-width, initial-scale=1"/> <link rel="stylesheet" type="text/css" href="css/bootstrap.css"/> </head> <body> <nav class="navbar navbar-default"> <div class="container-fluid"> </div> </nav> <div class="col-md-6 well"> <hr style="border-top:1px dotted #ccc;"/> <div class="col-md-6"> </div> </div> </body> </html>
var time = 0; var running = 0; function start(){ if(running == 0){ running = 1; timer(); document.getElementById("start").innerHTML = "Pause"; document.getElementById("start").setAttribute('class', 'btn btn-danger'); }else{ running = 0; document.getElementById("start").innerHTML = "Resume"; document.getElementById("start").setAttribute('class', 'btn btn-warning'); } } function reset(){ running = 0; time = 0; document.getElementById("start").innerHTML = "Start"; document.getElementById("result").innerHTML = "00:00:00"; document.getElementById("start").setAttribute('class', 'btn btn-primary'); } function timer(){ if(running == 1){ setTimeout(function(){ time++; var mins = Math.floor(time/10/60)%60; var secs = Math.floor(time/10)%60; var ms = time%10; if(mins<10){ mins = "0" + mins; } if(secs<10){ secs = "0" + secs; } document.getElementById("result").innerHTML = mins+ ":" +secs+ ":" + "0" +ms; timer(); },100); } }