i want create timer pause , resume in 1 button in javascript... timer working fine.pause , resume working fine if 2 different button.but if make single button resume not happening .need help...
javascript:
paused = false; // set minutes var mins = 30; // calculate seconds var secs = mins * 60; var t = 0; function countdown() { t = settimeout('decrement()', 1000); } function decrement() { if (document.getelementbyid) { minutes = document.getelementbyid("minutes"); seconds = document.getelementbyid("seconds"); // if less minute remaining if (seconds < 59) { seconds.value = secs; } else { minutes.value = getminutes(); seconds.value = getseconds(); } secs--; t = settimeout('decrement()', 1000); } } function getminutes() { // minutes seconds divided 60, rounded down mins = math.floor(secs / 60); return mins; } function getseconds() { // take mins remaining (as seconds) away total seconds remaining return secs - math.round(mins * 60); } function pause() { cleartimeout(t); document.getelementbyid('pause').value = "resume"; document.getelementbyid("pause").onclick = resume(); } function resume() { t = settimeout(); }
html:
<head> <title>countdown</title> <script src='myscript'></script> </head> <body> <div id="timer"> <input id="minutes" style="width: 24px; border: none; background-color:none;>mts <input id=" seconds " style="width: 26px; border: none; background-color:none;>second <div id="timer"> <input type="button" id="pause" value="pause" onclick="pause();" /> </div> </div> <script> countdown(); </script> </head>
problem in resume function
it should that
try code
<html> <head> <title>countdown</title> <script type="text/javascript"> paused = false; // set minutes var mins = 30; // calculate seconds var secs = mins * 60; var t=0; var flagtimer='resume'; function countdown() { t = settimeout('decrement()',1000); } function decrement() { if (document.getelementbyid) { minutes = document.getelementbyid("minutes"); seconds = document.getelementbyid("seconds"); // if less minute remaining if (seconds < 59) { seconds.value = secs; } else { minutes.value = getminutes(); seconds.value = getseconds(); } secs--; t= settimeout('decrement()',1000); } } function getminutes() { // minutes seconds divided 60, rounded down mins = math.floor(secs / 60); return mins; } function getseconds() { // take mins remaining (as seconds) away total seconds remaining return secs-math.round(mins *60); } function pause() { if( flagtimer=='resume') { cleartimeout(t); t=0;alert(' 12c ya'); document.getelementbyid('pause').value="resume"; flagtimer='pause'; } else { flagtimer='resume'; document.getelementbyid('pause').value="pause"; resume(); } } function resume() { t= settimeout('decrement()',1000); } </script> </head> <body> <div id="timer"> <input id="minutes" style="width: 24px; border: none; background-color:none;">mts <input id="seconds" style="width: 26px; border: none; background-color:none;"/>second <div id="timer"> <input type="button" id="pause" value="pause" onclick="pause();" /> </div> </div> <script> countdown(); </script> </body> </html>
live test http://jsbin.com/ajegas/8
fiddle http://jsfiddle.net/hb5e9/1/
Comments
Post a Comment